DOMContentLoaded.Next
Written by on November 25th, 2006 in Ajax News.
Andrea Giammarchi has taken the work of Dean Edwards, Mark Wubben, and Paul Sowden to create his DOMContentLoaded Final Solution.
The work comes with a test page for http and https, and is documented in this function:
// [please note that this code doesn't work]
// private scope variable
var IEStringToWrite = // this is IE dedicated string
“<script defer src=’//:’ onreadystatechange=’
(function(element){
// if readystate is complete
if(element.readyState === “complete”)
// call the global variable
window.__onContent__();
})(this);
‘></script>”;
// the above string is necessary to use onreadystatechange property
// with an undefined page. In this way IE tell us the readyState
// of the current document
// to call callback function IE need a global scope variable
// this variable could call one or more callback
// then if it’s already created we need to call the old callback
// then this new callback
window.__onContent__ = (function(oldCallback){
// returns a function that will delete __onContent__
// to remove multiple callbacks with different
// events and different ways for each browser
return function(){
// clear __onContent__ as generic function
window.__onContent__ = function(){};
// checks if oldCallback isn’t null or undefined
if(oldCallback)
oldCallback(); // call them to preserve the right order
callback(); // call this scope callback function
// (sent calling onContent)
}
})(window.__onContent__); // undefined if is the first time we use __onContent__
// __onContent__ is my function to use as callback
// I need to add this function as event
// Opera 9 and FireFox both support DOMContentLoaded as well as
// addEventListener document method
if(document.addEventListener)
document.addEventListener(”DOMContentLoaded”, __onContent__, false);
// if some browser supports addEventListener but doesn’t support DOMContentLoaded
// event I don’t need to care about that because this event will never be fired
// at the same time if Safari or KDE one day will support DOMContentLoaded
// I prefere use this dedicated in-core
// event instead of next trick that’s quite horrible but works with Safari,
// KDE as Opera 8.5 and lower too
// that’s why I don’t use an else if but an if … because the first time
// event will be fired __onContent__
// became an empty function … then calling them twice is not a problem
if(
// Safari and KDE
/WebKit|Khtml/i.test(navigator.userAgent) ||
// Opera less than 9
(window.opera && parseInt(window.opera.version())<9)
)
// runtime anonymous function
(function(){
// checks if document.readyState is loaded or complete
/loaded|complete/.test(document.readyState) ?
// then call __onContent__ , stopping internal loop
window.__onContent__() :
// or loops itself with the faster timeout
setTimeout(arguments.callee, 1);
})();
// at this point I’ve setted the DOMContentLoaded event for every browser
// but not for Inernet Explorer.
else if (/MSIE/i.test(navigator.userAgent))
// I can write dedicated string
document.write(IEStringToWrite);
};
Source: Ajaxian
Original Article: http://ajaxian.com/archives/domcontentloadednext