src和href的区别
src的特性
1. 引用外部资源
比如script元素、img元素、iframe元素、video元素
2. 会替换元素本身的内容
比如下面这两段代码，会打印出2，而不是打印1
// test.js console.log(2) 复制代码
<script src="./test.js"> console.log(1) </script> 复制代码
原因就是test.js的代码嵌入到了当前script元素中，导致原本的内容被替换。
3. 会暂停其他资源的下载
当浏览器解析到使用src的元素时，会暂停其他资源资源的下载，直到scr引用资源加载、编译、执行完毕。这也是为什么script元素推荐放在html结构的底部
href的特性
1. 表示超链接
比如a标签、link标签，表示外部资源与该页面的联系
2. 不会替换元素本身的内容
比如下面这段代码，点击a标签跳转到另外一个页面，但图片内容没有被替换
<a href="www.baidu.com"> <img src="xxx"/> </a> 复制代码
3. 不会暂停其他资源的下载
像CSS那样影响页面观感的可以放在html结构的头部优先加载
核心思想上的区别
src代表的是网站的一部分，没有会对网站的使用造成影响
herf代表网站的附属资源，没有不会对网站的核心逻辑和结构造成影响
为什么引用CSS使用href？
正如herf代表的含义一样，CSS属于网站的附属资源，不影响网站核心逻辑和结构
也可以简单归结为历史遗留问题
作者：Reiner
链接：https://juejin.cn/post/7026525458619432973