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
0
投稿猜你喜欢
在日常的开发中经常进行跨数据库进行查询数据。同服务器下跨数据库进行查询在表前加上数据库名就可以查询到数据。在数据超出服务器承载的时候，往往需- 和获取网页上的信息不同，想要进行模拟登录还需要向服务器发送一些信息，如账号、密码等等。模拟登录一个网站大致分为这么几步：1.先将登录网站的隐
- python现在的版本，主要是python2和python3两个大版本，这两个版本有很大的不同。当我们在自己电脑上同时安装了python2.
- Matplotlib的概念这里就不多介绍了，关于绘图库Matplotlib的安装方法：点击这里小编之前也和大家分享过python使用matp
- torch.nn.BatchNorm1d()1、BatchNorm1d(num_features, eps = 1e-05, momentu
- 本文实例讲述了Python自动扫雷实现方法。分享给大家供大家参考。具体如下：#pyWinmineCrack.py# coding: utf-
- 多表连接查询表与表之间的连接分为内连接和外连接内连接：仅选出两张表互相匹配的记录外连接：既包括两张表匹配的记录，也包括不匹配的记录，同时外连
- 将有安全问题的SQL过程删除.比较全面.一切为了安全!删除了调用shell，注册表，COM组件的破坏权限MS SQL SERVER2000使
- 前言本文提供获取视频时长的python代码，精确到毫秒，一如既往的实用主义。环境依赖 ffmpeg环境安装，可以参考：window
- Python 是一种极其多样化和强大的编程语言！当需要解决一个问题时，它有着不同的方法。在本文中，将会展示列表解析式（List Compre
- 通过session，我们可以在多次浏览器请求中保持数据， 接下来的部分就是用session来处理用户登录了。 当然，不能仅凭用户的一面之词，
- ElementUI是饿了么推出的一套基于vue2.x的一个ui框架。官方文档也很详细，这里做一个element-ui日期插件的补充。官方文档
- 本文实例讲述了Python列表生成式与生成器操作。分享给大家供大家参考，具体如下：列表生成式：能够用来创建list的生成式比如想要生成类似[
- 在使用操作XML文件时,我们可以使用Load方法直接加载xml文件即可，在ie和ff下通用。但是是XML字符串，则在两种浏览器下就会有所不同
- 本文实例为大家分享了python编写实现抽奖器的具体代码，供大家参考，具体内容如下# coding=utf-8import sysimpor
- 问题描述在电脑中重新安装Anaconda3＆PyCharm后，运行原来的程序画图时出现了下图界面。不能弹出如下图所示的“figure”窗口。
- 前言这里存储过程和游标的定义和作用就不介绍了，网上挺多的，只通过简单的介绍，然后用个案例让大家快速了解。实例中会具体说明变量的定义，赋值，游
- 本文实例讲述了Python中函数参数调用方式。分享给大家供大家参考，具体如下：Python中函数的参数是很灵活的，下面分四种情况进行说明。(
- <? //以树型结构列出指定目录里的所有文件，如果你想知道自己某个目录里有哪些子目录和文件，可以调用这个类来查看，很方便的。 &nbs
- （一）原理 小偷程序实际上是通过了XML中的XMLHTTP组件调用其它网站上的网页。比如新闻小偷程序，
