Script标签属性defer和async的区别

1.没有defer和async属性时

浏览器从上到下解析HTML标签遇到<script src="/demo.js"></script>时，会停止解析并向服务器发起请求，请求到demo.js后，停止解析HTML，开始执行demo.js里的代码，执行完之后，再继续解析HTML标签。

---

2.有async属性时

浏览器从上到下解析HTML标签遇到<script src="/demo.js"></script>时，向服务器发起请求并继续解析下面的HTML标签，请求到demo.js后，停止解析HTML标签，并开始执行demo.js里的代码，执行完之后，再继续解析下面的HTML标签。

---

3.有defer属性时

浏览器从上到下解析HTML标签遇到<script src="/demo.js"></script>时，向服务器发起请求并继续解析下面的HTML标签，请求到demo.js后也不会停止解析，当所有的HTML解析完成触发DOMContentLoaded事件时，才会开始执行demo.js里的代码。