async 和 defer 的作用
async:async 屬性標(biāo)注的腳本是異步腳本,即異步下載腳本時(shí),不會(huì)阻塞文檔解析,但是一旦下載完成后,立即執(zhí)行,阻塞文檔解析。
defer 屬性標(biāo)注的腳本是延遲腳本,使得瀏覽器延遲腳本的執(zhí)行,也就是說(shuō),腳本會(huì)被異步下載但是不會(huì)被執(zhí)行,直到文檔的載入和解析完成,并可以操作,腳本才會(huì)被執(zhí)行。
有什么區(qū)別??
正常情況下的<script src=""></script>
瀏覽器讀到它,就會(huì)被執(zhí)行,并且阻礙下邊代碼的執(zhí)行。。
- 用了async:不會(huì)阻礙文檔的解析,但是一旦加載了就會(huì)立即執(zhí)行,不能保證執(zhí)行的順序,因?yàn)閍sync的腳本執(zhí)行順序是沒(méi)有保證的,因此要確認(rèn)腳本間沒(méi)有依賴關(guān)系。
- 用了defer :讀到了,也不會(huì)立即執(zhí)行,要等文檔都讀取完畢,再去執(zhí)行。
兩者的相同點(diǎn)
加載文件時(shí)不阻塞頁(yè)面渲染。
對(duì)于inline的script無(wú)效。
使用這兩個(gè)屬性的腳本中不能調(diào)用document.write方法。
有腳本的onload的事件回調(diào)。