JavaScript 判断 DOM 何时加载完毕 - 集合



// 未引入jq时，用来替代jQuery:ready()的js代码 [1~4]
// 实际使用时，只用一两个就可以了。
// 比较: 代码[3]调用较方便, 总体代码较少, addEvent()等函数可重用.


// 未引入jq时，用来替代jQuery:ready()的js代码[1]
// Demo : IEContentLoaded(this, 'func'); // 只传函数名
          IEContentLoaded(this, "ccid1_select2reset('arcdeal[ccid1]','');");
// From : http://javascript.nwbox.com/IEContentLoaded/
// 缺点：onreadystatechange 只能执行一次



// 未引入jq时，用来替代jQuery:ready()的js代码[2]
// Demo : 
DomReady.ready(function() { 
ccid1_select2reset('arcdeal[ccid1]','');
alert('dom is ready');
});
// From : http://code.google.com/p/domready/



// 未引入jq时，用来替代jQuery:ready()的js代码[3]
// Demo : domReady("ccid1_select2reset('arcdeal[ccid1]','');"); 
//        domReady('_start_ccid1_55'); 
// From : http://www.cnblogs.com/ninofocus/archive/2012/11/11/2764640.html
//        监听 DOM 是否可用的函数



// 未引入jq时，用来替代jQuery:ready()的js代码[4]
// Demo : 
// dom.Ready(function(){
ccid1_select2reset('ccid1','0');
// });
// From : http://www.cnblogs.com/rubylouvre/archive/2009/12/30/1635645.html
//        javascript的domReady

---

/*
// 未引入jq时，用来替代jQuery:ready()的js代码 [1~4]
// 实际使用时，只用一两个就可以了。
// 比较: 代码[3]调用较方便, 总体代码较少, addEvent()等函数可重用.
*/


/*
// 未引入jq时，用来替代jQuery:ready()的js代码[1]
// Demo : IEContentLoaded(this, 'func'); // 只传函数名
          IEContentLoaded(this, "ccid1_select2reset('arcdeal[ccid1]','');");
// From : http://javascript.nwbox.com/IEContentLoaded/
// 缺点：onreadystatechange 只能执行一次
*/
function IEContentLoaded(w, fn) {
var d = w.document, done = false,
// only fire once
init = function () {
if (!done) {
done = true;
jsEval(fn);
}
};
// polling for no errors
(function () {
try {
// throws errors until after ondocumentready
d.documentElement.doScroll('left');
} catch (e) {
setTimeout(arguments.callee, 50);
return;
}
// no errors, fire
init();
})();
// trying to always fire before Onload
d.onreadystatechange = function() {
if (d.readyState == 'complete') {
d.onreadystatechange = null;
init();
}
};
}


/*
// 未引入jq时，用来替代jQuery:ready()的js代码[2]
// Demo : 
DomReady.ready(function() { 
ccid1_select2reset('arcdeal[ccid1]','');
alert('dom is ready');
});
// From : http://code.google.com/p/domready/
*/
(function(){
    var DomReady = window.DomReady = {};
// Everything that has to do with properly supporting our document ready event. Brought over from the most awesome jQuery. 
    var userAgent = navigator.userAgent.toLowerCase();
    // Figure out what browser is being used
    var browser = {
    version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [])[1],
    safari: /webkit/.test(userAgent),
    opera: /opera/.test(userAgent),
    msie: (/msie/.test(userAgent)) && (!/opera/.test( userAgent )),
    mozilla: (/mozilla/.test(userAgent)) && (!/(compatible|webkit)/.test(userAgent))
    };    
var readyBound = false;
var isReady = false;
var readyList = [];
// Handle when the DOM is ready
function domReady() {
// Make sure that the DOM is not already loaded
if(!isReady) {
// Remember that the DOM is ready
isReady = true;
       if(readyList) {
           for(var fn = 0; fn < readyList.length; fn++) {
               readyList[fn].call(window, []);
           }
           readyList = [];
       }
}
};
// From Simon Willison. A safe way to fire Onload w/o screwing up everyone else.
function addLoadEvent(func) {
 var oldOnload = window.Onload;
 if (typeof window.Onload != 'function') {
   window.Onload = func;
 } else {
   window.Onload = function() {
     if (oldOnload) {
       oldOnload();
     }
     func();
   }
 }
};
// does the heavy work of working through the browsers idiosyncracies (let's call them that) to hook Onload.
function bindReady() {
if(readyBound) {
   return;
   }
readyBound = true;
// Mozilla, Opera (see further below for it) and webkit nightlies currently support this event
if (document.addEventListener && !browser.opera) {
// Use the handy event callback
document.addEventListener("DOMContentLoaded", domReady, false);
}
// If IE is used and is not in a frame
// Continually check to see if the document is ready
if (browser.msie && window == top) (function(){
if (isReady) return;
try {
// If IE is used, use the trick by Diego Perini
// http://javascript.nwbox.com/IEContentLoaded/
document.documentElement.doScroll("left");
} catch(error) {
setTimeout(arguments.callee, 0);
return;
}
// and execute any waiting functions
   domReady();
})();
if(browser.opera) {
document.addEventListener( "DOMContentLoaded", function () {
if (isReady) return;
for (var i = 0; i < document.styleSheets.length; i++)
if (document.styleSheets[i].disabled) {
setTimeout( arguments.callee, 0 );
return;
}
// and execute any waiting functions
           domReady();
}, false);
}
if(browser.safari) {
   var numStyles;
(function(){
if (isReady) return;
if (document.readyState != "loaded" && document.readyState != "complete") {
setTimeout( arguments.callee, 0 );
return;
}
if (numStyles === undefined) {
               var links = document.getElementsByTagName("link");
               for (var i=0; i < links.length; i++) {
                if(links[i].getAttribute('rel') == 'stylesheet') {
                   numStyles++;
                }
               }
               var styles = document.getElementsByTagName("style");
               numStyles += styles.length;
}
if (document.styleSheets.length != numStyles) {
setTimeout( arguments.callee, 0 );
return;
}
// and execute any waiting functions
domReady();
})();
}
// A fallback to window.Onload, that will always work
   addLoadEvent(domReady);
};
// This is the public function that people can use to hook up ready.
DomReady.ready = function(fn, args) {
// Attach the listeners
bindReady();
// If the DOM is already ready
if (isReady) {
// Execute the function immediately
fn.call(window, []);
   } else {
// Add the function to the wait list
       readyList.push( function() { return fn.call(window, []); } );
   }
};
bindReady();
})();


/*
// 未引入jq时，用来替代jQuery:ready()的js代码[3]
// Demo : domReady("ccid1_select2reset('arcdeal[ccid1]','');"); 
//        domReady('_start_ccid1_55'); 
// From : http://www.cnblogs.com/ninofocus/archive/2012/11/11/2764640.html
//        监听 DOM 是否可用的函数
*/
function domReady(f) {
    // 假如DOM已经加载，马山执行函数
    if(domReady.done) return f();
    // 假如我们已经增加了一个函数
    if(domReady.timer) {
        // 把它假如待执行函数清单中
        domReady.ready.push(f);
    } else {
        // 为页面加载完毕绑定一个事件，以防它最先完成。
        addEvent(window, "load", isDOMReady);
        // 初始化执行函数的数组
        domReady.ready = [f];
        // 尽可能快的检查DOM是否已可用
        domReady.timer = setInterval(isDOMReady, 13);
    }
}
// 检查 DOM 是否已可操作
function isDOMReady() {
    // 如果我们能判断出DOM已可能，忽略
    if(domReady.done) return false;
    // 检查若干函数和元素是否可能
    if(document && document.getElementsByTagName && document.getElementById && document.body) {
        // 如果可用，我们停止检查
        clearInterval(domReady.timer);
        domReady.timer = null;
        // 执行所有正在等待的函数
var _n = domReady.ready.length;
        for(var _i = 0; _i < _n; _i++){
jsEval(domReady.ready[_i]);
        }
// 记录我们在此已经完成
        domReady.ready = null;
        domReady.done = true;
    }
}
function addEvent( obj, type, fn ) { 
if ( obj.attachEvent ) { 
obj['e'+type+fn] = fn; 
obj[type+fn] = function(){obj['e'+type+fn]( window.event );} 
obj.attachEvent( 'on'+type, obj[type+fn] ); 
} else 
obj.addEventListener( type, fn, false ); 
} 
function removeEvent( obj, type, fn ) { 
if ( obj.detachEvent ) { 
obj.detachEvent( 'on'+type, obj[type+fn] ); 
obj[type+fn] = null; 
} else 
obj.removeEventListener( type, fn, false ); 
}


/*
// 未引入jq时，用来替代jQuery:ready()的js代码[4]
// Demo : 
// dom.Ready(function(){
ccid1_select2reset('ccid1','0');
// });
// From : http://www.cnblogs.com/rubylouvre/archive/2009/12/30/1635645.html
//        javascript的domReady
*/
new function(){
  dom = [];
  dom.isReady = false;
  dom.isFunction = function(obj){
    return Object.prototype.toString.call(obj) === "[object Function]";
  }
  dom.Ready = function(fn){
    dom.initReady();//如果没有建成DOM树，则走第二步，存储起来一起杀
    if(dom.isFunction(fn)){
      if(dom.isReady){
        fn();//如果已经建成DOM，则来一个杀一个
      }else{
        dom.push(fn);//存储加载事件
      }
    }
  }
  dom.fireReady =function(){
    if (dom.isReady)  return;
    dom.isReady = true;
    for(var i=0,n=dom.length;i<n;i++){
      var fn = dom[i];
      fn();
    }
    dom.length = 0;//清空事件
  }
  dom.initReady = function(){
    if (document.addEventListener) {
      document.addEventListener( "DOMContentLoaded", function(){
        document.removeEventListener( "DOMContentLoaded", arguments.callee, false );//清除加载函数
        dom.fireReady();
      }, false );
    }else{
      if (document.getElementById) {
        document.write("<script id=\"ie-domReady\" defer='defer'src=\"//:\"><\/script>");
        document.getElementById("ie-domReady").onreadystatechange = function() {
          if (this.readyState === "complete") {
            dom.fireReady();
            this.onreadystatechange = null;
            this.parentNode.removeChild(this)
          }
        };
      }
    }
  }
}