jquery的$(document).ready()和onload的加载顺序
发布时间:2023-08-23 18:57:40
最近在改一个嵌入在frame中的页面的时候,使用了jquery做效果,而页面本身也绑定了onload事件。改完后,Firefox下测试正常流畅,IE下就要等个十几秒jquery的效果才出现,黄花菜都凉了。
起初以为是和本身onload加载的方法冲突。网上普遍的说法是$(document).ready()是在页面DOM解析完成后执行,而onload事件是在所有资源都准备完成之后才执行,也就是说$(document).ready()是要在onload之前执行的,尤其当页面图片较大较多的时候,这个时间差可能更大。可是我这页面分明是图片都显示出来十几秒了,还不见jquery的效果出来。
删了onload加载的方法试试,结果还是一样,看来没有必要把原本的onload事件绑定也改用$(document).ready()来写。那是什么原因使得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绑定的方法执行之后才轮到。而这个页面中正好在测试环境下有一个访问不到的资源,那十几秒的延迟正是它放大出的时间差。
作者:Joyce Liu
猜你喜欢
- 【ThinkPHP版本查询】dump(THINK_VERSION);模板获取get参数{$Think.get.pageNumber}或者$R
- system默认:managersys默认:change_on_install使用SQL Plus登录数据库时,system使用密码mana
- 一、 Scott用户下的表结构SCOTT。是在Oracle数据库中,一个示例用户的名称。其作用是为初学者提供一些简单的应用示例,不过其默认是
- 判断服务器是否安装了某种asp组件,比较常用的代码如下:代码如下:<% '功能:检查是否存在系统组件或组件是否安装成功
- httpwatch 的页面元素加载时间表里面有一堆的英文,平时也没注意看,今天瞟了一眼,觉得应该有些用处,就看了看,随便用蹩脚的英语水平翻译
- 从PJBlog 2.7开始,验证码的功能就很好很强大了,但是同时也给手工输入带来了不小的麻烦——经常输错。之前我写了一个《自己写的一个PJB
- 最近做网站期间遇到个问题,就是用到比较流行的lightbox效果,就是点击链接后会弹出个固定大小窗口,弹出后窗口下面的内容是被遮罩掉的,最近
- 首先建一个access 数据库,库中有一个URLINDEX表,其中URL和Keywords字段分别添加了索引,如下:URL &nb
- 开始第一篇。老规矩,先无聊的谈论天气一类的话题。十一长假,天气也终于开始有些秋天的味道,坐在屋里甚至觉得需要热咖啡。话说两年前也是在国庆假期
- 本文实例讲述了PHP判断密码强度的方法。分享给大家供大家参考,具体如下:一、php页面$score = 0;if(!empty($_GET[
- 数据库服务器主要用于存储、查询、检索企业内部的信息,因此需要搭配专用的数据库系统,对服务器的兼容性、可靠性和稳定性等方面都有很高的要求。下面
- 本文实例为大家分享了python定时发送邮件的具体代码,供大家参考,具体内容如下全部代码如下:import timefrom datetim
- 在Python 3.10发布之前,Python是没有类似于其他语言中switch语句的,要实现类似的功能最简单的方法就是通过if ... e
- 思想:4个数字的排列,加上3个运算符的排列,使用后缀表达式的表现如下:情形一:1,2,3,4,+,-,* => 24*24*4情形二:
- 类、构造函数、原型先来说明一点:在上面的内容中提到,每一个函数都包含了一个prototype属性,这个属性指向了一个prototype对象(
- 1.在使用MySQL和php的时候出现过中文乱码问题(1) 只要是gb2312,gbk,utf8等支持多字节编码的字符集都可以储存汉字,当然
- 一个动态载入asp树源码。把 node.htc, style.css 保存与 css 目录下. index.asp subtree.asp
- 使用ASP设置指定站点CPU最大使用程度'=============================================
- “没 Javascript 就会死”的页面通常都会加入 noscript 标签用于提示用户开启脚本支持。 然而在 IE8 下,如果在 nos
- 简单试用了一下IE8后,今天相对有时间点,对IE8、IE7、IE6、Firefox2.0.0.12做了简单的一些CSS HACK测