window.onload()函数和jQuery中的document.ready()区别
Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法，不过相比较而言还是有区别的。
1.执行时机
window.onload()是必须等图片在内的一切元素加载完成后才能执行。 $(document).ready()是当DOM结构完成后就执行，不必等到全部元素加载完毕。
2.编写个数
window.onload()只能编写一个，当写多个的时候会把前面所写的覆盖，只执行一个。 $(document).ready()可以写多个，并且可以同时执行。
3.简化写法
window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});
| window.onload() | $(document).ready() | |
|---|---|---|
| 执行时机 | 必须等待网页中所有的内容加载完毕后(包括图片)才能执行 | 网页中所有DOM结果绘制完毕后就执行，可能DOM元素关联的东西并没有加载完 |
| 编写个数 |
不能同时编写多个
以下代码无法正确执行：
window.load = function() {
alert("test1");
};
window.load = function() {
alert("test2");
};
结果只会输出“test2”
|
能同时编写多个
以下代码可以正确执行：
$(document).ready(function(){
alert("Hello World!");
});
$(document).ready(function(){
alert("Hello again!");
});
结果两次都输出
|
| 简化写法 | 没有简化写法 |
$(document).ready(function(){
...
});
可以简写成：
$(function(){
...
});
|