我们可以从以下三个方面简单的比较window.onload与$(document).ready()的区别:
1.执行时机:
window.onload:必须等待网页中所有的内容加载完毕后(包括图片)才能执行;
$(document).ready():网页中所有DOM结构绘制完毕后就能执行,可能DOM元素关联的东西还没加载完。
2.编写个数:
window.onload:不能同时编写多个;
$(document).ready():能同时编写多个。
3.简化写法:
window.onload:没有简写;
$(document).ready():$(document).ready(function(){//其他代码});可以简写成$(function(){//其他代码});
因为用$(document).ready()注册的事件处理的程序,在DOM完全就绪时就可以调用,网页加载DOM树的速度比把网页中所有内容都加载的速度要快很多,所以用$(document).ready()比用window.onload要快一点。但是,需要注意的一点是,对于$(document).ready(),在处理DOM关联的一些图片的宽高属性时不一定有效,对此可以用jquery的另一个关于加载页面的方法——load()方法。如果处理函数绑定给window对象,则会在所有内容加载完毕后触发,如果处理函数绑定在元素在,则会在元素的内容加载完毕后触发。jquery代码如下:
$(window).load(function(){
//其他代码
})
这段代码就等价于以下js代码:
window.onload = function(){
//其他代码
}