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，如需转载请自行联系原作者