Note that there are some explanatory texts on larger screens.

plurals
  1. POWhat external resources are loaded when window.onload event is fired and what is the loading order of the resources?
    primarykey
    data
    text
    <p>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. </p> <p>After doing some search, I found it is not the case what i usually think. From this page: <a href="https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html" rel="nofollow noreferrer">https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html</a>, it seems images are not loaded when onload event is fired. But from here <a href="https://stackoverflow.com/questions/191157/window-onload-vs-body-onload">window.onload vs &lt;body onload=&quot;&quot;/&gt;</a>, it seems to me the images are loaded when onload is fired. There is more more confusion for me from this link <a href="http://forums.mozillazine.org/viewtopic.php?f=25&amp;t=413504&amp;start=0&amp;st=0&amp;sk=t&amp;sd=a" rel="nofollow noreferrer">http://forums.mozillazine.org/viewtopic.php?f=25&amp;t=413504&amp;start=0&amp;st=0&amp;sk=t&amp;sd=a</a>. </p> <p>So my first part of the question is: Are all resources REALLY loaded when window.onload is fired? </p> <p>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 <a href="https://stackoverflow.com/questions/65434/getting-notified-when-the-page-dom-has-loaded-but-before-window-onload">Getting notified when the page DOM has loaded (but before window.onload)</a>). But what about external javascript and css resources? For example, if I write my page like this:</p> <pre><code> &lt;external stylesheet...&gt; &lt;external javascript #1...&gt; &lt;external javascript #2...&gt; &lt;script&gt; ..... window.onload=.... &lt;/script&gt; </code></pre> <p>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?</p> <p>You may say the resource loading sequence and when to fire window.onload event is dependent on the browser implementation, as said here <a href="https://stackoverflow.com/questions/282245/what-is-the-event-precedence-in-javascript">What is the event precedence in JavaScript?</a>. 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? </p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload