当window.onload事件被触发哪些外部资源加载，什么是资源的加载顺序？ [英] What external resources are loaded when window.onload event is fired and what is the loading order of the resources?
问题描述
由于单个网页可能含有大量的外部资源：外部JavaScript，外部CSS，图像，小程序，Flash等，平时我的传统智慧告诉我，当所有的链接资源是window.onload事件被触发完成下载（虽然外部资源在多个线程或处理由浏览器的实现通常下载）。通常情况下可在大部分时间工作。但是......如果加载顺序是不是我想当然的东西，一些javascript错误可能的地方和某个蠕变英寸
Since a single web page may contain lots of external resource: external javascript, external css, images, applets, flash, etc., usually my conventional wisdom tells me that the window.onload event is fired when all the linked resources are finished downloading(though the external resources are usually downloaded in multiple threads or processes by the browser's implementation). The usual case may work in most of the time. But...what if the loading sequence is not what I take it for granted, some javascript bug may creep in somewhere and sometime.
在做一些搜索之后，我发现这不是我通常认为的情况。从这个页面：<一href=\"https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html\" rel=\"nofollow\">https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html,似乎当onload事件被触发图像不加载。但是，从这里在window.onload VS＆LT;身体的onload =＆QUOT;＆QUOT; /＆GT; ，在我看来，当onload事件被触发的图像加载。还有更多我比较混乱，从这个链接<一个href=\"http://forums.mozillazine.org/viewtopic.php?f=25&t=413504&start=0&st=0&sk=t&sd=a\" rel=\"nofollow\">http://forums.mozillazine.org/viewtopic.php?f=25&t=413504&start=0&st=0&sk=t&sd=a.
After doing some search, I found it is not the case what i usually think. From this page: https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html, it seems images are not loaded when onload event is fired. But from here window.onload vs <body onload=""/>, it seems to me the images are loaded when onload is fired. There is more more confusion for me from this link http://forums.mozillazine.org/viewtopic.php?f=25&t=413504&start=0&st=0&sk=t&sd=a.
所以我的问题的第一部分是：当在window.onload触发是否所有的资源真的装？
So my first part of the question is: Are all resources REALLY loaded when window.onload is fired?
问题的另一个密切相关的部分是：什么是资源加载顺序在window.onload被触发过吗？我知道内部资源，如内部JavaScript或CSS，加载顺序是从页面的顶部到底部（除非在IE中使用递延脚本在这里说，<一个href=\"http://stackoverflow.com/questions/65434/getting-notified-when-the-page-dom-has-loaded-but-before-window-onload\">Getting当页面的DOM加载通知（但在window.onload之前））。
但对于外部JavaScript和CSS资源？例如，如果我写我的网页是这样的：
Another closely related part of the question is: What is the resources loading order before window.onload is fired? I know for internal resources such as internal javascript or css, the loading order is from top of the page to the bottom (unless in IE, use the deferred script as here says Getting notified when the page DOM has loaded (but before window.onload)). But what about external javascript and css resources? For example, if I write my page like this:
<external stylesheet...>
<external javascript #1...>
<external javascript #2...>
<script>
.....
window.onload=....
</script>
然后假设外部JavaScript＃2调用外部JavaScript＃1的功能，我可以肯定它总是工作的功能？此外，如果在window.onload调用一个函数外部JavaScript＃1也可以作为预期？
Then assuming a function in "external javascript #2" calls a function in "external javascript #1", can i be sure it ALWAYS works? Also if window.onload calls a function in "external javascript #1" also works as expected?
您可能会说，资源加载顺序和何时启window.onload事件是依赖于浏览器实现，这里说的什么是JavaScript中的事件precedence？。但我还是想知道是否有在公众一个规范或约定。所以，请你参考我的资源或告诉我事实来清除我的困惑？
You may say the resource loading sequence and when to fire window.onload event is dependent on the browser implementation, as said here What is the event precedence in JavaScript?. But i am still wondering if there is a spec or convention in the public. So would you please refer me to a resource or tell me the facts to clear my confusion?
推荐答案
查看 Cuzillion 。它是从雅虎性能团队来评估正是这些东西写了史蒂夫Souders的。
Check out Cuzillion. It was written by Steve Souders from the Yahoo performance team to evaluate exactly these things.
什么它归结为是这样的：在浏览器才能加载脚本它们在文档中遇到的，而每个脚本下载所有其他装载被暂停。其他资源（CSS /图像）异步加载，你无法确定何时会完成。
What it comes down to is this: Browsers load scripts in the order they are encountered in the document and all other loading is halted while each script is downloaded. Other resources (css/images) are loaded asynchronously and you cannot be certain when they will complete.
onload事件触发时的文件和它的脚本/风格/图像加载资源，但你可能不希望等待的图像，如果你正在做的任何JavaScript加载页面时。相反，使用类似jQuery的准备事件或通过在体尾放置脚本标记触发自己的domready中事件：
The onload event fires when the document and it's script/style/image resources are loaded, but you probably don't want to wait for images if you are doing any javascript when the page is loaded. Instead, use something like jQuery's "ready" event or fire your own "DOMReady" event by placing a script tag at the end of the body:
<body>
<!-- your page contents here -->
<script type="text/javascript">
// DOM is ready, do scripty stuff now
DOMReady();
</script>
</body>
这篇关于当window.onload事件被触发哪些外部资源加载，什么是资源的加载顺序？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
