網頁的載入和執行順序
概述
當請求網頁時，瀏覽器執行載入並執行其內容的一系列任務。這涉及處理 HTML 文件、獲取和執行外部資源以及渲染頁面。
載入順序
-
HTML 文件：瀏覽器下載HTML
- 內聯資源（腳本和樣式）：
- 內聯資源（腳本和樣式）： 當瀏覽器遇到內聯<script> 時，和<風格>標籤，它會立即解析並執行它們。 </script>
- 外部資源（腳本和 CSS）：下載、解析外部腳本檔案 (
圖片和其他內容：
瀏覽器同時進行下載 HTML 文件中指定的圖片和其他資源。
執行 JavaScript
內聯 JavaScript：內聯 JavaScript 在解析後立即執行。
外部JavaScript：- 阻止： 如果外部腳本被標記為defer 或async，瀏覽器會下載並執行它，然後再繼續解析HTML。
非阻塞：
如果外部腳本被標記為加載，瀏覽器會下載它並異步執行它，而不會阻塞 HTML 解析。
頁面解析和渲染後對 CSS 的變更將動態更新頁面的外觀。
$(document).ready 的時機
$(document).ready 函數在所有 HTML 元素和外部資源都已載入並執行後執行。這確保 JavaScript 程式碼可以安全地與頁面元素互動。
- 圖片下載
- 如果是第一次在頁面上遇到 abc.jpg，則會下載它。
kkk.png 將被下載並取代 ![Web 瀏覽器如何載入並執行網頁的內容？]()
中的 abc.jpg元素，因為它是使用 JavaScript 動態設定的。
跨瀏覽器的變化
不同瀏覽器的載入和執行順序可能略有不同，但一般原則保持不變。
- 參考文獻
- [瀏覽器工程書籍](https://browser.engineering/)
- [網頁中的JavaScript 執行順序](https: //developer.mozilla .org/en-US/docs/Web/HTML/Element/script)
[瀏覽器中的頁面生命週期](https://addyosmani.com/blog/page- lifecycle-in-browsers/)
以上是Web 瀏覽器如何載入並執行網頁的內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
