首先,
Jquery 代码:
$(window).load(function (){ // 代码表达式 });
等价于:
JavaScript 中的以下代码
Window.onload = function (){ // 编写代码 }
注意,格式符号。
区别总结:
1、执行时间
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
2、编写个数不同
window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
$(document).ready()可以同时编写多个,并且都可以得到执行
3、简化写法
window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});
应用细说:
ready()方法,因为执行时间的不同,不一定要等所有的js和图片加载完毕,就可以执行一些方法,不过有些时候,必须要等所有的元素都加载完毕,才可以执行一些方法的时候,比如说,部分图片或者与DOM相关的什么其他方面还没有加载好,所以例如图片的高度和宽度这样的属性此时不一定有效,这个时候,点击某些按钮,会导致出现意外的情况,这时,就需要选择window.onload方法!
最后补充:
在一个嵌入在frame中的页面的时候,使用了jquery做效果,而页面本身也绑定了onload事件。改完后,Firefox下测试正常流畅,IE下就要等个十几秒jquery的效果才出现。
那是什么原因使得Firefox正常而IE就不正常呢?
接着调试,发现IE下原来绑定的onload方法竟然先于$(document).ready()的内容执行,而Firefox则是先执行$(document).ready()的内容,再执行原来的onload方法,这和上面说的完全相反!
翻阅jquery的源码看看$(document).ready()是如何实现的吧:
if ( jQuery.browser.msie && window == top ) (function(){ if (jQuery.isReady) return; try { document.documentElement.doScroll("left"); } catch( error ) { setTimeout( arguments.callee, 0 ); return; } // and execute any waiting functions jQuery.ready(); })(); jQuery.event.add( window, "load", jQuery.ready );
结果很明了了,IE只有在页面不是嵌入frame中的情况下才和Firefox等一样,先执行$(document).ready()的内容,再执行原来的onload方法。对于嵌入frame中的页面,也只是绑定在load事件上执行,所以自然是在原来的onload绑定的方法执行之后才轮到。
发表评论(不用注册哟!)