? 一般項(xiàng)目中會(huì)把JS放在DOM之后,body之前,這樣做即使JS出現(xiàn)了錯(cuò)誤,也不會(huì)影響DOM的渲染.

? 若把js放在了DOM之前,

此時(shí)我們用 console.log(document.getElementById('box'))去獲取DOM中的元素是獲取不到的.

為了解決這種問(wèn)題,我們可以再js的引入中加上async和defer兩個(gè)關(guān)鍵字,來(lái)讓js的加載延遲.

defer和async的區(qū)別:在講兩者區(qū)別之前我們先了解一下瀏覽器的解析方式

分為四個(gè)部分HTML的解析,HTML的解析暫停,JS的下載,和JS的執(zhí)行.

當(dāng)我們用傳統(tǒng)方法引入JS的時(shí)候HTML和JS的過(guò)程如下.

使用async時(shí):

使用defer時(shí):

defer:等html全部解析完才會(huì)執(zhí)行JS的代碼,順次執(zhí)行JS腳本.

async:誰(shuí)先加載完就先執(zhí)行誰(shuí)