jQUery中的$(document).ready()方法和window.onload()方法的区别

1.常规的Javascript代码中,通常使用window.onload方法

window.onload = function(){//代码}

2.jquery中,则使用$(document).ready()方法

$(document).ready(function(){//代码})

3.两个方法有相似的功能,但是在执行时机方面是有区别的
- window.onload方法是在网页中所有的元素(包括元素的所有的关联文件)完全加载到浏览器后才执行,此时,javascript才可以访问网页中的任何元素.
- 通过$(document).ready()方法注册的事件处理程序,在DOM完全就绪时就可以被调用.此时,网页中的所有元素对jQuery而言,都是可以访问的,但这并不代表这些元素关联的文件都已经加载完毕.这也会造成一个问题,例如与图片有关的html下载完,并且已经解析为DOM树了,但很有可能图片还未加载 完成,以致像图片的宽度和高度这样的属性此时不一定有效.要解决该问题,可以使用jquery中方的load()方法.该方法会在元素的onload事件中绑定一个处理函数.

$(window).load(function(){//代码});

该方法就等价于 window.onload = function(){//代码}

4.编写个数
- javascript中的onload事件一次只能保存对一个函数的引用,它会自动用后面的函数覆盖前面的函数,不能在现有的行为上添加新的行为.

function one(){alert("one")};
function two(){alert("two")};

window.onload = one;
window.onload = two;

运行上述代码,发现只能弹出字符串"two"对话框.

- $(document).ready()方法,每次调用,都会在现有的行为上追加新的行为,这些行为会根据注册的顺序依次执行.

5.$(document).ready()方法有两种简写形式.$(function(){}),另外$(document)也可以简写为$(),$().ready(function(){}).