IE9开始和其他现代浏览器可以通过绑定DOMContentLoaded事件；
IE9之前的的浏览器需要绑定onreadystatechange事件并等待readyState为"complete"来判断；
此外IE9之前的浏览器还可以通过不停地执行document.documentElement.doScroll("left")直到不抛出异常来判断。
IE还可以通过<script>脚本设置属性defer="defer"，并判断该脚本的onreadystatechange事件来触发DOM-Ready。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <style rel="stylesheet" type="text/css"> 6 </style> 7 <script type="text/javascript"> 8 setTimeout(function(){ 9 10 // 事件队列. 11 var readyFns; 12 // 标记状态.fireReady触发时设置为true. 13 var isReady=false; 14 15 // 添加监听事件或马上执行. 16 window.ready=function(fn){ 17 initReady(); 18 if(isReady){ 19 fn(); 20 } 21 else{ 22 readyFns.push(fn); 23 } 24 }; 25 // 触发DOM-Ready事件. 26 function fireReady(){ 27 // 只执行一次. 28 if(isReady){ 29 return; 30 } 31 isReady=true; 32 // 遍历执行. 33 if(readyFns){ 34 for(var i=0,fn;fn=readyFns[i++];){ 35 fn(); 36 } 37 // 清空事件. 38 readyFns.length=0; 39 } 40 } 41 // IE678下判断DOM是否加载完毕. 42 function doscrollcheck(){ 43 try{ 44 document.documentElement.doScroll("left"); 45 document.title+="doscroll"; 46 fireReady(); 47 } 48 catch(e){ 49 setTimeout(doscrollcheck,1); 50 } 51 } 52 // 初始化监听. 53 function initReady(){ 54 if(readyFns){ 55 return; 56 } 57 readyFns=[]; 58 // 添加事件绑定. 59 if(document.addEventListener){ 60 document.title+="W3C"; 61 document.addEventListener("DOMContentLoaded",function(){ 62 document.removeEventListener("DOMContentLoaded",arguments.callee,false); 63 fireReady(); 64 },false); 65 } 66 else if(document.attachEvent){ 67 document.title+="IE678"; 68 document.attachEvent("onreadystatechange",function(){ 69 if(document.readyState==="complete"){ 70 document.detachEvent("onreadystatechange",arguments.callee); 71 fireReady(); 72 } 73 }); 74 document.attachEvent("onload",function(){ 75 document.title="onload"; 76 fireReady() 77 }); 78 // 顶层窗口还可以检测doScrollCheck方法来检测是否可以触发ready事件 79 if(document.documentElement.doScroll){ 80 // 是否为顶层窗口. 81 if(self===self.top){ 82 doscrollcheck(); 83 } 84 } 85 } 86 } 87 // 如果是动态加载上面的脚本.则应该判断是否完成. 88 (function(){ 89 if(document.readyState==="complete"){ 90 document.body.innerHTML+="document.readyState loaded"; 91 fireReady(); 92 } 93 })(); 94 95 // 测试. 96 ready(function(){ 97 document.body.innerHTML+="1"; 98 }); 99 ready(function(){ 100 document.body.innerHTML+="2"; 101 }); 102 ready(function(){ 103 document.body.innerHTML+="3"; 104 }); 105 },0);// 调整延迟来模拟"动态加载该DOM-Ready的情况" 106 107 108 setTimeout(function(){ 109 ready(function(){ 110 document.body.innerHTML+="4"; 111 }); 112 },1000); 113 window.onload=function(){ 114 document.body.innerHTML+="loaded"; 115 }; 116 117 </script> 118 </head> 119 <body><img src="http://1.su.bdimg.com/skin_zoom/38.jpg" style="10px;height:10px;" /></body> 120 </html>
参考司徒正美的一篇博客：javascript的domReady