load事件是在页面加载完毕后触发

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function  ready(fn){
     if (document.addEventListener) {
         document.addEventListener( 'DOMContentLoaded' function () {
             //注销事件, 避免反复触发
             document.removeEventListener( 'DOMContentLoaded' ,arguments.callee,  false );
             fn();             //执行函数
         },  false );
     } else  if (document.attachEvent) {         //IE
         document.attachEvent( 'onreadystatechange' function () {
             if (document.readyState ==  'complete' ) {
                 document.detachEvent( 'onreadystatechange' , arguments.callee);
                 fn();         //函数执行
             }
         });
     }
     };

ready()加强版(自JavaScript权威指南)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
/*
  * 传递函数给whenReady()
  * 当文档解析完毕且为操作准备就绪时,函数作为document的方法调用
  */
var  whenReady = ( function () {                //这个函数返回whenReady()函数
     var  funcs = [];              //当获得事件时,要运行的函数
     var  ready =  false ;           //当触发事件处理程序时,切换为true
      
     //当文档就绪时,调用事件处理程序
     function  handler(e) {
         if (ready)  return ;        //确保事件处理程序只完整运行一次
          
         //如果发生onreadystatechange事件,但其状态不是complete的话,那么文档尚未准备好
         if (e.type ===  'onreadystatechange'  && document.readyState !==  'complete' ) {
             return ;
         }
          
         //运行所有注册函数
         //注意每次都要计算funcs.length
         //以防这些函数的调用可能会导致注册更多的函数
         for ( var  i=0; i<funcs.length; i++) {
             funcs[i].call(document);
         }
         //事件处理函数完整执行,切换ready状态, 并移除所有函数
         ready =  true ;
         funcs =  null ;
     }
     //为接收到的任何事件注册处理程序
     if (document.addEventListener) {
         document.addEventListener( 'DOMContentLoaded' , handler,  false );
         document.addEventListener( 'readystatechange' , handler,  false );             //IE9+
         window.addEventListener( 'load' , handler,  false );
     } else  if (document.attachEvent) {
         document.attachEvent( 'onreadystatechange' , handler);
         window.attachEvent( 'onload' , handler);
     }
     //返回whenReady()函数
     return  function  whenReady(fn) {
         if (ready) { fn.call(document); }
         else  { funcs.push(fn); }
     }
})();
  
//--------------------- test -----
function  t1() {
     console.log( 't1' );
}
function  t2() {
     console.log( 't2' );
}
  
// t2-t1-t2
whenReady(t1);
t2();
whenReady(t2);




本文转自 爱笑嘚蛋蛋 51CTO博客,原文链接:http://blog.51cto.com/dd118/1965649,如需转载请自行联系原作者