1. HTML中的 src 与 href
1.1 概述
HTML中的 `src` 和 `href` 是两个常用的属性，分别用于引用外部资源路径和链接。两者的使用也是有差别的，下面来详细介绍一下它们的区别。
1.2 src属性
`src`是 source 的缩写，指的是资源（图片、音频、视频等）的URL地址，它是在网页加载时就获取资源并渲染到页面上，因此在使用`src`时需要注意以下几点：
- 不可以省略引用的文件，因为src指向了外部的资源，如果无法获取这个文件，所有的渲染过程都将会停滞。
- 使用`<script>` 标签时，`defer`和`async`属性是在浏览器解析该标签时进行异步载入执行的，而不是直接渲染页面后再执行。这样可以让整个页面更快地呈现，并减少整个页面暂停和阻塞的时间。
- `` 标签的 `src` 属性加载时会返回一个状态码，如果图片无法加载，这个返回的状态码就会是404，如果图片太大，会造成页面大小的加载延迟。
1.3 href属性
`href`是 hyper reference的缩写，指的是指向某些资源（如CSS文件、JS文件、HTML文件）的链接。使用`href`时，可以省略该文件，在浏览器中通过点击链接才会进行资源的加载。
- `<link>` 标签中通常使用 `href` 属性指向样式表文件（CSS文件）的链接，例如：
<link href="styles.css" rel="stylesheet" type="text/css" />
- `<a>` 标签中使用 `href` 属性指向外部页面或者内部锚点的链接，例如：
<a href="http://www.example.com/">这是一个外部链接</a>
<a href="bottom">跳转到页面底部</a>
- `<script>` 标签也可以使用 `href` 属性指向外部JS文件的链接，与`src`属性的区别是，`href`属性的JS文件需要提前下载
1.4 区别
总结`src`和`href`的区别，主要有以下几点：
- **异同的载入时机。**
`src`的资源会在页面的加载并渲染过程中得到获取和应用，而`href`的资源则需要等到将要所链接的元素被确定位置进行下载和渲染。
- **使用方式的不同。**
`src`直接在页面引用，常用于传输外部文件 我们好比装室内风扇需要使用链接的方式引用，而`href`需要链接进行使用和直接使用进行导航，我们好比需要安装一个灯光密码锁。
- **用于的标签区别。**
`src`用于``、`
1.5 参考资料
以上是`src`与`href`的基本区别，如果读者想要了解更多有关于HTML语言的知识，可以参考W3school的教程。