1,src ,指向外部资源,指向的内容就会嵌入到文档中当前标签的位置。
在请求src资源的时候,会将其指向的资源下载并应用到文档内部,一般用在js脚本文件,img图片和frame元素等。
当浏览器解析到该元素的时候,会暂停其他资源的下和处理,知道该资源加载,编译,执行完毕,图片和框架等元素也是这样的。这就是为什么要将js脚本文件放在底部而不是头部的原因
提到src不得不提到aync和defer
2,href
指向网络资源所在的位置,建立和当前元素或者当前文章之间的链接
<link href="common.css" rel="stylesheet"/>
这个时候浏览器会识别该文档为css文件,就会并行下载资源并且不会停止对当前文档的处理。
外部引入css文件还有另外一种方式就是使用@import的方式。
@import url("CSS文件");
但是两者不同的是:
1,link是html标签,除了可以加载css文件之外,还可以定义其他文件,比如rss。而@import只属于css范畴,只能加载css
2,link引用css 的时候,在页面载入的同时,可以并行加载css。但是对于import,需要页面网页完全载入之后才能加载。
3,link是html标签,没有兼容问题,但是@import是css2.1提出的,低版本的浏览器不支持。
4,link支持使用js控制dom去改变link标签的样式,但是import不支持