在HTML中，<script>标签可以使用async和defer两个属性来控制外部JavaScript文件的加载和执行方式。这两个属性的目的是优化页面加载时间，但它们以不同的方式工作。下面是每个属性的具体说明：
async属性
- 当你给
<script>标签添加async属性时，浏览器会异步加载脚本。这意味着脚本会在页面继续解析的同时被加载，而不会阻塞文档的解析。 - 一旦脚本下载完成，浏览器会暂停HTML的解析，执行脚本，然后再继续解析HTML。
- 多个
async先下载完的先执行
async属性适用于那些不依赖于其他脚本，同时也不被其他脚本依赖的情况，因为它不能保证脚本的加载顺序。
defer属性
- 当你给
<script>标签添加defer属性时，浏览器也会异步加载脚本，但与async不同的是，defer脚本会等到整个文档都解析完毕后，且在DOMContentLoaded事件触发之前执行。 - 这意味着不管脚本何时完成加载，它的执行都会等到文档解析完毕。
- 多个defer等待所有defer下载完依次执行。
defer属性适用于那些依赖于DOM或其它脚本，或者被其它脚本依赖的场景。
总结
下面是一个表格，比较这两个属性的不同之处：
| 特性 | async | defer |
|---|---|---|
| 加载方式 | 并行加载脚本 | 并行加载脚本 |
| 执行时机 | 脚本下载完成后立即执行（可能会在文档解析完成前） | 文档解析完成后，DOMContentLoaded事件触发前执行 |
| 执行顺序 | 不能保证脚本按照在文档中出现的顺序执行 | 保证脚本按照在文档中出现的顺序执行 |
| 适用场景 | 不依赖DOM，不依赖其它脚本的独立模块 | 依赖DOM，或其它脚本，且不影响文档显示的脚本 |
