【javascript中的window.onload() 和 jquery中的 $(document).ready()】

 1 加载DOM (javascript中的window.onload() 和 jquery中的 $(document).ready())

Window.onload（）方法是在网页中的所有元素（包含元素的所有关联文件）完全加载到浏览器后才执行

Jquery的$(document).ready()) 方法注册的时间处理程序，在dom完全就绪就可以被调用

如果一个网站有很多图片，那么用window.ready() 加载 就要等图片都下好后 才可以执行操作，而用$(document).ready())则是dom加载完就会执行操作了。 $(document).ready())

由于dom已经被解析，但图片还有可能没被加载完毕，所以例如图片的高度和宽度这样的属性不一定有效，jquery还提供另一种加载方法，load（）方法、load方法会在元素的onload事件绑定一个处理函数。如果处理函数绑定给一个window对象，则会在所有内容（包括窗口，框架，对象，图像）加载完毕后触发，如果处理函数绑定在元素上，则会在元素的内容加载完毕后触发。

jquery代码如下

$（window.load）(function(){

//代码

})

同javascript

Window.onload=function(){

//代码

}

2,多次使用

Function one（）       Function two（）

｛                    ｛

Alert（“one”）；          Alert（“two”）；

｝                      ｝

使用window.onload加载 

Window.onload=one；window.onload=two；  运行代码后 发现智慧显示 two

因为javascript的onload事件一次只能保存对一个函数的引用。后面的函数会自动覆盖前面的函数

两个函数效果顺序实现

Window.onload=function(){

One();

Two();

}

Jquery每次都会在现有的行为上追加新的行为

$（document）.ready(function(){

One();

})

$（document）.ready(function(){

two();

})

3，简写

$(function(){

代码

})

 

<script type="text/javascript">

function fn1(){alert("OK");}

function fn2(){alert("再来一次！")}

//document.getElementById('div1').attachEvent('onclick',fn1);

//document.getElementById('div1').addEventListener('click',fn1,false);

//document.getElementById('div1').addEventListener("click",fn2,false);

//document.getElementById('div1').onclick=fn1;

//document.getElementById('div1').attachEvent('onclick',fn2);

//document.getElementById('div1').onclick=function(){fn2();fn1()}

//document.getElementById('div2').attachEvent('onclick',fn3);

function addEventHandler(obj,sEvent,fnHandler){

if(obj.addEventListener){

obj.addEventListener(sEvent,fnHandler,false);

} else if(obj.attachEvent){

obj.attachEvent("on"+sEvent,fnHandler);

}else{

alert();

}

}

function removeEventHandler(obj,sEvent,fnHandler){

if(obj.removeEventListener){

obj.removeEventListener(sEvent,fnHandler,false);

} else if(obj.detachEvent){

obj.detachEvent("on"+sEvent,fnHandler);

}else{

alert();

}

}

var obj=document.getElementById('div1');

var obj2=document.getElementById('div2');

addEventHandler(obj,"click",fn1);

addEventHandler(obj,"click",fn2);

addEventHandler(obj2,"click",function fn3(){removeEventHandler(obj,"click",fn2); alert("我是FN3");}

)

addEventHandler(document.getElementById('div3'),"click",function(){removeEventHandler(obj2,"click",fn3); alert("run");});

//addEventHandler(window,"load",function aa(){alert("当WINDOW加载完成后运行的");});

//removeEventHandler(window,"load",aa);

</script>