寫在前面

　　作為前端小白，在開發過程中，h5頁面中加載js腳本，一般我們直接<script src="./index.js"></script>就加載完成了；最近在啃《JS高級》（P11）的時候，讀到<script>標簽的時候，發現它有倆個屬性：defer和async；今天就來總結一下。

一、不寫這倆個屬性

　　這裏我就先說說我對頁面加載的理解：

　　　html頁面加載時，至上而下加載，當遇到外聯的CSS和JS的時候，會停止對DOM的加載，轉而加載外聯的CSS和JS，當JS加載完成時，它會立即執行（所以一般JS都寫在body的最下面），CSS和JS執行完成後，會接著加載之後的DOM結構。

二、defer-延遲腳本

　　加上defer就變成延遲腳本，當加載到包含defer的JS腳本時，瀏覽器會開啟一個新線程並馬上下載JS文件，但是不會執行裏面的代碼；需要等到加載到</html>時，瀏覽器才會執行這兩個JS腳本，這兩個JS腳本時順序執行的，先執行example1.js，後執行example2.js。

　　包含defer的JS文件，會在DOMContentLoaded事件和loaded事件之前執行。（補充：DOMContentLoaded事件在Loaded事件之前）

三、async-異步腳本

　　此時是的JS時異步腳本，當瀏覽器加載到這兩個JS腳本時，瀏覽器開啟新線程下載這倆個JS腳本，下載的時候瀏覽器主線程還在加載中；當加載JS腳本完成時，這倆個腳本會馬上執行，此時主線程停止工作，這倆個JS腳本執行亂序，先執行example1.js，後執行example2.js還是先執行example2.js，後執行example1.js是不確定；當執行完這兩個JS文件後，瀏覽器的主線程才會繼續執行。

　　包含async的JS文件，會在Loaded事件之前執行，在DOMContentLoaded事件的前後不一定。

總結

　　我就直接拿過來用了~~

Javascript的defer和async