HTML中src属性的值指定要指定位置插入的媒体资源URL，例如：

<img src="images/dinosaur.jpg">

这段代码会在页面指定位置嵌入一张名为dinosaur.jpg的图片，图片路径为：images/dinosaur.jpg。

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

这段代码会在页面指定位置嵌入一段JS脚本，脚本内容来自路径：scripts/main.js。

使用src属性指定资源表示用该资源替换当前内容，一般情况下，当浏览器解析到src ，会暂停对其他资源的下载和处理，直到将该资源加载、编译、执行完毕（这也就是我们常说的阻塞DOM解析）。

但并非src属性引用的资源在下载或执行时就一定会阻塞页面，比如JS脚本可以通过添加defer或async属性来降低阻塞。

基于src属性的特点，我们可以将它理解为：用指定资源替换当前内容，就像它本来就被写进页面了一样。

再来说一下href属性：

href是超文本引用，常用在link和a元素上，它的作用是在当前元素和引用资源之间建立联系。

下面这段代码创建了一个指向Mozilla主页的超链接：

<a href="https://www.mozilla.org/zh-CN/">Mozilla 主页</a>

而下面这段代码创建了一个样式文件：

<link rel="stylesheet" href="styles.css">

上面的例子中，a标签没有可下载执行的资源，而link标签中用href引用了一个样式文件styles.css。

当浏览器解析到link元素时，会通过rel="stylesheet"将资源识别为CSS文件，并通过href链接获取资源。

但和src不同，href资源的加载是和页面解析并行处理的，期间不会暂停对其他资源的下载和处理，也不会阻塞DOM解析。

基于href属性的特点，我们可以将它理解为：用于在当前文档和引用资源之间确立联系，两者虽然有关联，但是引用资源的加载是和页面解析并行处理的，因此并不会阻塞DOM解析。