src的特性

1. 引用外部资源

比如script元素、img元素、iframe元素、video元素

2. 会替换元素本身的内容

比如下面这两段代码，会打印出2，而不是打印1

console.log(2)

<script src="./test.js">
    console.log(1)
</script>

原因就是test.js的代码嵌入到了当前script元素中，导致原本的内容被替换。

3. 会暂停其他资源的下载

当浏览器解析到使用src的元素时，会暂停其他资源资源的下载，直到src引用资源加载、编译、执行完毕。这也是为什么script元素推荐放在html结构的底部

href的特性

1. 表示超链接

比如a标签、link标签，表示外部资源与该页面的联系

2. 不会替换元素本身的内容

比如下面这段代码，点击a标签跳转到另外一个页面，但图片内容没有被替换

<a href="www.baidu.com">
    <img src="xxx"/>
</a>

3. 不会暂停其他资源的下载

像CSS那样影响页面观感的可以放在html结构的头部优先加载