说DOMContentLoaded就不得不先说window.onload,根据我自己的理解,window.onload是等DOM和文件全部加载完以后,才会执行window.onload里面的内容,而DOMContentLoaded是DOM加载完以后就开始执行了,所以比window.onload的效率高。
使用DOMContentLoaded必须要事件绑定,而事件绑定需要处理兼容,且ie68不支持DOMContentLoaded事件,所以要针对ie6/ie8做兼容性处理。
下面是封装的domReady:
function domReady(fn) {
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', function() {
fn && fn(); //处理事情
}, false);
} else {
/*监控资源情况,ie8及以下不支持addEventListener*/
document.onreadystatechange = function() {
/*dom加载完成的时候*/
if (document.readyState == 'complete') {
fn && fn(); //处理事情
}
};
}
}