JavaScript 如何處理網頁中的腳本載入和執行順序？

JavaScript 腳本在網頁中的載入和執行順序是怎麼樣的？

JavaScript 腳本可以以多種方式包含在網頁中方式，包括：

• 內聯程式碼或從外部載入URL
• 包含在中或標籤
• 沒有、延遲或非同步屬性（僅適用於外部腳本）
• 包含在靜態來源中或使用其他腳本動態新增

載入順序

腳本按照在HTML程式碼中遇到的順序加載，無論是否它們是內聯的或外部的。然而，動態新增的腳本的載入順序可能會受到瀏覽器行為的影響。

執行順序

JavaScript 腳本的執行順序取決於幾個因素：

• 一般規則：腳本按照在頁面中遇到的順序執行，除了標記為async.
• 非同步腳本： 標記為非同步的腳本以不可預測的順序執行。它們可能會在載入後或解析器完成後立即運行。
• 動態新增的腳本：動態新增的腳本的行為取決於瀏覽器。
• defer Scripts： 標記有defer 的腳本會等待解析器完成，然後按它們原來的順序執行
• 模組腳本（type="module" ）：模組腳本會自動賦予defer 屬性，並在解析完成後依序執行。他們還可以使用 async 屬性立即運行內聯模組腳本。

範例

在正文中包含內聯腳本的給定範例中，載入順序是：

1. 中的初始化腳本
2. 用於腳本載入的外部腳本
3. 內聯腳本新增另一個外部腳本
4. 使用新增的外部腳本的內聯腳本

執行順序取決於動態新增的腳本是否標記為非同步或not:

• 如果新增的腳本沒有標記為非同步，它將在新增它的內聯腳本之後執行。
• 如果新增的腳本被標記為非同步，它的執行順序是不可預測的，可能發生在新增它的內聯腳本之前或之後。

以上是JavaScript 如何處理網頁中的腳本載入和執行順序？的詳細內容。更多資訊請關注PHP中文網其他相關文章！