1、执行时间不同
- window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
- $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
js代码
var img = new Image();
img.src = "./浅拷贝.png";
document.body.appendChild(img);
console.log(img.width +' ,'+ img.height);
此时控制台输出如下图(IE浏览器上如下图 。而在火狐, edge上就是加载完成,不知道为什么??)
说明img的图像资源还没加载进html中。
当js代码如下时
var img = new Image();
img.src = "./浅拷贝.png";
document.body.appendChild(img);
img.onload = function(){
console.log(img.width +' ,'+ img.height);
}
此时控制台如下如
此时说明img资源加载完毕。
通过上述代码论断。可知onload函数是必须等到页面内包括图片的所有元素加载完毕后才能执行。
2、编写个数不同
- window.onload只能执行一个,当你写多个window.onload函数时,只执行最后一个。
- $(document).ready()可以同时编写多个,并且都可以得到执行
3、简写形式
- window.onload
函数没有简写形式
- $(document).ready()
函数的简写形式为$(function(){})