网页的加载和执行顺序？
我已经完成了一些基于Web的项目，但是对于普通网页的加载和执行顺序，我考虑得并不多。但是现在我需要知道细节。很难从Google或SO找到答案，因此我创建了这个问题。 示例页面如下： <html> <head> <script src="jquery.js" type="text/javascript"></script> <script src="abc.js" type="text/javascript"> </script> <link rel="stylesheets" type="text/css" href="abc.css"></link> <style>h2{font-wight:bold;}</style> <script> $(document).ready(function(){ $("#img").attr("src", "kkk.png"); }); </script> </head> <body> <img id="img" src="abc.jpg" style="width:400px;height:300px;"/> <script src="kkk.js" type="text/javascript"></script> </body> </html> 所以这是我的问题： 该页面如何加载？ 加载的顺序是什么？ 何时执行JS代码？（内联和外联） CSS何时执行（应用）？ $（document）.ready什么时候执行？ 会下载abc.jpg吗？还是只是下载kkk.png？ 我有以下理解： 浏览器首先加载html（DOM）。 浏览器开始逐行从上到下加载外部资源。 如果一个 <script>满足a，将阻止加载并等待，直到加载并执行JS文件，然后继续。 其他资源（CSS /图像）并行加载并在需要时执行（例如CSS）。 还是这样的： 浏览器解析html（DOM），并以数组或类似堆栈的结构获取外部资源。加载html后，浏览器开始并行加载结构中的外部资源并执行，直到所有资源都加载完毕。然后，根据JS，将根据用户的行为更改DOM。 任何人都可以详细说明当您得到HTML页面的响应时会发生什么情况？这在不同的浏览器中是否有所不同？关于这个问题有参考吗？ …