src 和 href 的区别

加载js的时候,用到的是<script style="text/javascript" src="js/demo.js"></script>

加载css的时候,用到的是<link rel="stylesheet" href="css/demo.css" />

一个用到的是src,另一个用到的是href,这两个有什么区别呢?

href 表示超文本引用(hypertext reference),在 link和a 等元素上使用。

src 表示来源地址,在 img、script、iframe 等元素上。

src 的内容,是页面必不可少的一部分,是引入。href 的内容,是与该页面有关联,是引用。区别就是,引入和引用。

href是指向网络资源所在位置,简历和当前元素(锚点)或当前文档(链接)之间的链接,用于超链接。当我们写下:

<link rel="stylesheet" href="css/demo.css" />

浏览器明白当前资源是一个样式表,页面解析不会暂停(由于浏览器需要样式规则去画或者渲染页面,渲染过程可能会被暂停)。这与把css文件内容写在标签里不相同,因此建议使用link标签而不是@import来吧样式表导入到html文档里。

src是指向外部资源的位置,指向的内容将会嵌入到文档中当前标签的所在位置;在请求src资源时会将其指向的资源下载并应用到文档內;当浏览器找到:

<script src= "script.js" ></script>

在浏览器下载,编译,执行这个文件之前页面的加载和处理会被暂停。这个过程与把js文件放到<script>标签里类似。这也是建议把JS文件放到底部加载的原因。当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。标签里类似。这也是建议把JS文件放到底部加载的原因。当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。

注:所以为了页面加载速度,我们一般把js文件放在<body>标签的后面。

推荐阅读更多精彩内容