网页的加载和执行顺序
概述
当请求网页时，浏览器执行加载并执行其内容的一系列任务。这涉及处理 HTML 文档、获取和执行外部资源以及渲染页面。
加载顺序
-
HTML 文档： 浏览器下载 HTML
-
内联资源（脚本和样式）： 当浏览器遇到内联 <script> 时，和<风格>标签，它会立即解析并执行它们。</script>
-
外部资源（脚本和 CSS）：下载、解析外部脚本文件 (
-
图像和其他内容： 浏览器同时进行下载 HTML 文档中指定的图像和其他资源。
执行 JavaScript
内联 JavaScript：内联 JavaScript 在解析后立即执行。
外部 JavaScript：
-
阻止： 如果外部脚本被标记为 defer 或 async，浏览器会下载并执行它，然后再继续解析 HTML。
-
非阻塞：如果外部脚本被标记为加载，浏览器会下载它并异步执行它，而不会阻塞 HTML 解析。
CSS 的执行
- CSS 被应用到页面，因为它在
- 页面解析和渲染后对 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中文网其他相关文章！
