01.(function(){
02.
if(!window.JS){
03.
window['JS'] = {}
04.
}
05.
var addEvent = function( obj, type, fn ) {
06.
if (obj.addEventListener)
07.
obj.addEventListener( type, fn, false );
08.
else if (obj.attachEvent) {
09.
obj["e"+type+fn] = fn;
10.
obj.attachEvent( "on"+type, function() {
11.
obj["e"+type+fn]();
12.
} );
13.
}
14.
};
15.
var onReady = function(loadEvent,waitForImages) {
16.
if(waitForImages) {
17.
return addEvent(window, 'load', loadEvent);
18.
}
19.
}
20.
JS.onReady = onReady;
21.
var $ = function(id){
22.
return document.getElementById(id);
23.
}
24.
JS.$ = $;
25.})()<!doctype html>
<html dir="ltr" lang="zh-CN">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<title>闭包环境中的事件加载</title>
<script type="text/javascript">
(function(){
if(!window.JS){
window['JS'] = {}
}
var addEvent = function( obj, type, fn ) {
if (obj.addEventListener)
obj.addEventListener( type, fn, false );
else if (obj.attachEvent) {
obj["e"+type+fn] = fn;
obj.attachEvent( "on"+type, function() {
obj["e"+type+fn]();
} );
}
};
var onReady = function(loadEvent,waitForImages) {
if(waitForImages) {
return addEvent(window, 'load', loadEvent);
}
}
JS.onReady = onReady;
var $ = function(id){
return document.getElementById(id);
}
JS.$ = $;
})()
JS.onReady(function(){
alert(JS.$("test").innerHTML)
},true);
JS.onReady(function(){
alert("dddddddddddddddd")
},true);
</script>
</head>
<body>
<p id="test">Test</p>
</body>
</html>
运行代码Javascript
OK，没问题。上面的onReady函数有一个可选参数，判断图片是否加载完毕。我们知道JS引擎会在完成DOM树后才开始处理图片与音频等东西，但如果我们的页面严重依赖于脚本布局呢？！我们想尽快让页面呈现出大体形态，这就用到domReady了。我们在原基础上改进它。
01.(function(){
02.
if(!window.JS){
03.
window['JS'] = {}
04.
}
05.
var addEvent = function( obj, type, fn ) {
06.
if (obj.addEventListener)
07.
obj.addEventListener( type, fn, false );
08.
else if (obj.attachEvent) {
09.
obj["e"+type+fn] = fn;
10.
obj.attachEvent( "on"+type, function() {
11.
obj["e"+type+fn]();
12.
} );
13.
}
14.
};
15.
var onReady = function(loadEvent,waitForImages) {
16.
if(waitForImages) {
17.
return addEvent(window, 'load', loadEvent);
18.
}
19.
var init = function() {
20.
if (arguments.callee.done) return;
21.
arguments.callee.done = true;
22.
loadEvent.apply(document,arguments);
23.
};
24.
if(!+"v1"){
25.
(function(){
26.
try {
27.
document.documentElement.doScroll("left");
28.
} catch(e) {
29.
