JavaScript 腳本載入和執行順序如何因內聯、外部、非同步、延遲和動態新增的腳本而變化？

了解JavaScript 腳本的載入和執行順序

由於包含外部腳本和動態腳本新增的方式多種多樣，網頁中的JavaScript 執行順序可能會很複雜。為了弄清楚其中的複雜性，讓我們根據不同的場景深入研究JavaScript 腳本的載入和執行順序：

內聯腳本與外部腳本

無論是內聯程式碼還是從外部載入的腳本一個URI，腳本在解析期間會依照它們在頁面中出現的順序執行。因此，外部腳本之後的內聯腳本會等待這些外部腳本載入並執行。

非同步腳本

標示 async 屬性的非同步腳本以不可預測的順序執行。瀏覽器並行加載它們並運行它們，而不考慮順序。

延遲腳本

具有 defer 屬性的延遲腳本將被載入但保留到解析完成為止。然後，它們按照遇到的順序執行，保留延遲腳本之間的依賴關係。

動態新增的腳本

動態腳本插入行為因瀏覽器而異。例如，除非另有說明，否則 Firefox 預設動態新增非同步腳本標籤。非同步腳本可以立即執行，也可以在解析後執行。

執行順序

考慮到上述情況，原始問題中描述的場景的執行順序如下：

• 中的初始化和腳本載入腳本（依序載入並執行）
• 中的第一個內聯腳本動態載入腳本（出現在中的外部腳本之後）
• 中的第二個內聯腳本依賴於動態載入的腳本
• 動態載入的外部腳本並行載入並執行（不可預測的順序）
• 第二個內嵌腳本只有在動態載入的腳本執行成功後才會執行。這是因為瀏覽器通常會按照腳本遇到的順序優先執行腳本。

以上是JavaScript 腳本載入和執行順序如何因內聯、外部、非同步、延遲和動態新增的腳本而變化？的詳細內容。更多資訊請關注PHP中文網其他相關文章！