Is DOMContentLoaded event EXACTLY the same as jQuery's .ready() function?
Assuming browser that supports the event:
- The real event can support any
document
. jQuery will only use thedocument
it was loaded in, no matter what you pass to it. - jQuery will fire the event asynchronously even if the event has already happened. Attaching
'DOMContentLoaded'
event will do nothing if the event has already happened.
There is no delay in these browsers, see http://jsfiddle.net/rqTAX/3/ (the offsets logged are in milliseconds).
For browsers that don't support the event, jQuery's will obviously work for them as well. It will use a hacky mechanism that is not the same as the real DOMContentLoaded
and will not necessarily fire as soon as the real DOMContentLoaded
would:
// The DOM ready check for Internet Explorer
function doScrollCheck() {
if ( jQuery.isReady ) {
return;
}
try {
// If IE is used, use the trick by Diego Perini
// http://javascript.nwbox.com/IEContentLoaded/
document.documentElement.doScroll("left");
} catch(e) {
setTimeout( doScrollCheck, 1 );
return;
}
// and execute any waiting functions
jQuery.ready();
}
jQuery simulates this event by binding to the document
's readystatechange
event, which is the standard way of simulating DOMContentLoaded
in oldIE.
According to the jQuery source, that event fires "late" but before window.onload
. However, I can't find when that event fires exactly. DOMContentLoaded
fires when the DOM is built and ready for scripting, so readystatechange
fires after that; perhaps it waits for layout rendering or styling something like that, or the event is triggered later in the rendering/layout process?
Regardless, it will likely fire after DOMContentLoaded
, likely due to when IE decides to update the document
's readyState
to "complete."
(If anyone has a definite answer, post a comment and I'll update this answer; I'd love to know when exactly it fires myself, and I can't find that answer in any documentation or on any sites I would expect like Quirksmode.)