Sabtu, 10 September 2011
Depending on where the window.onload function is placed (head or body tag-element or any other further down), the window.onload event will shift in time and might be called twice (Chrome >v12, once in FireFox, once in Opera).
Browser behavior differs somewhat with internal event binding seeemingly slightly different in different browsers. Generally it seems that if window.onload is placed within the head -tag element, it will trigger once the DOM tree is loaded, and a second time once all content is loaded.
The general idea between a window.onload and document.onload event differentiation is that window.onload would fire when when the window is ready for presentation and document.onload, once the DOM tree (built from the markup code within the document) is completed.
Ideally this allow offscreen-manipulations with Javascript, incurring virtually no additional CPU load due to re-rendering. On the contrary window.onload can take a while to fire, when multiple external resources have yet to be loaded, and CPU-load intensive rendering could already have occured.
I wrote the following code for investigating and timing the behavior:
Also take a look at MDN's description of window.onload:
Browser behavior differs somewhat with internal event binding seeemingly slightly different in different browsers. Generally it seems that if window.onload is placed within the head -tag element, it will trigger once the DOM tree is loaded, and a second time once all content is loaded.
The general idea between a window.onload and document.onload event differentiation is that window.onload would fire when when the window is ready for presentation and document.onload, once the DOM tree (built from the markup code within the document) is completed.
Ideally this allow offscreen-manipulations with Javascript, incurring virtually no additional CPU load due to re-rendering. On the contrary window.onload can take a while to fire, when multiple external resources have yet to be loaded, and CPU-load intensive rendering could already have occured.
I wrote the following code for investigating and timing the behavior:
Also take a look at MDN's description of window.onload:
The load event fires at the end of the document loading process. At this point, all of the objects in the document are in the DOM, and all the images and sub-frames have finished loading.
There are also Gecko-Specific DOM Events like DOMContentLoaded and DOMFrameContentLoaded (which can be handled using element.addEventListener()) which are fired after the DOM for the page has been constructed, but do not wait for other resources to finish loading.