后使用快捷导航没有帐号？
只需一步，快速开始
查看: 78062|回复: 27
jquery $(document).ready(function(){
UID353219在线时间 小时积分393帖子离线17304 天注册时间
中级会员, 积分 393, 距离下一级还需 107 积分
最早接触的时候也说$(document).ready(function(){& &})这个函数是用来取代页面中的window.
但是今天发现 好像不是这样回事！是在做一个页面载入效果时发现的！
function winready(){document.getElementById(&loading&).style.display=&none&;}
window.onload=
以上的写法&&winready会在页面完全载入才触发；
jquery写法：
$(document).ready(function(){
&#loading&).css(&display&,&none&);
以前没发现，今天因为网络卡，发现一个页面的一张图片还没载入完成，jquery的ready函数就已经触发了！
document.onload&&window.onload &body onLoad=&winready()&&
到底又没区别？
UID353219在线时间 小时积分393帖子离线17304 天注册时间
中级会员, 积分 393, 距离下一级还需 107 积分
轻轻的俺沉下去了，轻轻的俺又浮上了....
大家发表自己的认识,不是给一定清楚的答案的！只是讨论下大家的观点
UID353219在线时间 小时积分393帖子离线17304 天注册时间
中级会员, 积分 393, 距离下一级还需 107 积分
轻轻的俺再次沉了,轻轻的俺再次浮上来了....
咋发现自己有灌水的嫌疑
UID308979在线时间 小时积分180帖子离线17304 天注册时间
初级会员, 积分 180, 距离下一级还需 20 积分
document.onload&&window.onload &body onLoad=&winready()&&
没有本质的区别，都是指页面载入完成后执行指定函数
而jquery的ready则是指在页面的DOM模型加载完后执行指定的函数
ready肯定在onload之前发生，页面加载大或者多的图片而使onload执行延后，使用jquery的ready可缓解此问题
UID326730在线时间 小时积分203帖子离线17304 天注册时间
中级会员, 积分 203, 距离下一级还需 297 积分
去看看jquery的文档吧！入门的例子就是这个。
UID365022在线时间 小时积分12帖子离线17304 天注册时间
新手上路, 积分 12, 距离下一级还需 38 积分
$(window).bind('load', function() {
& & winready();
UID11437在线时间 小时积分33帖子离线17304 天注册时间
新手上路, 积分 33, 距离下一级还需 17 积分
之所以用这个来取代window.onload，就是因为它是在dom模型加载完成后就执行，而window.onload是在dom元素加载完全后才执行
UID348286在线时间 小时积分14帖子离线17304 天注册时间
新手上路, 积分 14, 距离下一级还需 36 积分
想知道不用jquery的实现方法。
UID419045在线时间 小时积分89帖子离线17304 天注册时间
初级会员, 积分 89, 距离下一级还需 111 积分
文档载入完毕 只是指本文档的源代码
不包括文档中的包含的图片资源
UID14698在线时间 小时积分58帖子离线17304 天注册时间
初级会员, 积分 58, 距离下一级还需 142 积分
提醒:最后回贴距现在 208 天，请不要无意义回复原帖由 [i]yoyobp 于
05:17 发表
document.onload&&window.onload
没有本质的区别，都是指页面载入完成后执行指定函数
而jquery的ready则是指在页面的DOM模型加载完后执行指定的函数
ready肯定在onload之前发生，页面加载大或者多的图片而 ...
UID463676在线时间 小时积分246帖子离线17304 天注册时间
中级会员, 积分 246, 距离下一级还需 254 积分
不用jQuery的方法
&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
&html xmlns=&http://www.w3.org/1999/xhtml&&
&meta http-equiv=&Content-Type& content=&text/ charset=gb2312& /&
&title&kimipolo&/title&
&img id=&test& src=&http://p4.p.pixnet.net/albums/userpics/4/9/8a.jpg&&
&script type=&text/javascript&&
if (document.addEventListener) {
document.addEventListener(&DOMContentLoaded&, init, false);
// for Internet Explorer (using conditional comments)
/*@cc_on @*/
/*@if (@_win32)
document.write(&&script id=__ie_onload defer src=javascript:void(0)&&\/script&&);
var script = document.getElementById(&__ie_onload&);
script.onreadystatechange = function() {
if (this.readyState == &complete&) {
init(); // call the onload handler
/*@end @*/
window.onload=
function inits(){
idTest=document.getElementById('test');
alert('window.onload加载^_^\n'+idTest.src);
function init(){
idTest=document.getElementById('test');
alert('立即加载^_^\n'+idTest.src)
&提示：您可以先修改部分代码再运行
UID131066在线时间 小时积分5041帖子离线17304 天注册时间
window.onload要整个网页加载完成后（包括图片这些东西）才触发，
jquery的ready只要网页加载到有ready的代码处就执行了。
UID51240在线时间 小时积分757帖子离线17304 天注册时间
原帖由 [i]wolong 于
22:14 发表
window.onload要整个网页加载完成后（包括图片这些东西）才触发，
jquery的ready只要网页加载到有ready的代码处就执行了。
错。别误导人啊。
jq的ready是dom ready之后。
UID257416在线时间 小时积分269帖子离线17304 天注册时间
中级会员, 积分 269, 距离下一级还需 231 积分
原帖由 [i]鸡毛 于
22:23 发表
错。别误导人啊。
jq的ready是dom ready之后。
改进的window.onload,相当于快速载入~
UID387007在线时间 小时积分15775帖子离线17304 天注册时间
我精简了一下
通过不断尝试触发doScroll模拟ff的DOMContentLoaded
(function(){
& & & & try {
& & & & & & & & document.documentElement.doScroll(&left&);
& & & & } catch( error ) {
& & & & & & & & setTimeout( arguments.callee, 0 );
& & & & & & & &
& & & & fun();
UID353343在线时间 小时积分3781帖子离线17304 天注册时间
金牌会员, 积分 3781, 距离下一级还需 1219 积分
回复 15# cloudgamer
js中的try{}catch过于消耗资源。还是用if去判断比较快。
UID387007在线时间 小时积分15775帖子离线17304 天注册时间
回复 16# zehee
不知你的是怎么判断呢
UID490213在线时间 小时积分596帖子离线17304 天注册时间
高级会员, 积分 596, 距离下一级还需 404 积分
JQ的做法是指当DOM元素加载完成后就开始工作了
UID353343在线时间 小时积分3781帖子离线17304 天注册时间
金牌会员, 积分 3781, 距离下一级还需 1219 积分
原帖由 [i]cloudgamer 于
21:40 发表
不知你的是怎么判断呢
这是John Resig等人以前使用的方法，在JQ1.2中使用过，前一种方法在IE中有千分之几的失效率，不是完美的。但是效率还是比较高的。
UID387007在线时间 小时积分15775帖子离线17304 天注册时间
原帖由 [i]zehee 于
10:18 发表
/thread--1.html
这是John Resig等人以前使用的方法，在JQ1.2中使用过，前一种方法在IE中有千分之几的失效率，不是完美的。但是效率还是比较高的。
貌似就是判断
if ( document &&&&document.getElementsByTagName &&&&document.getElementById &&&&document.body )
但应该不行吧
&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
&html xmlns=&http://www.w3.org/1999/xhtml&&
if ( document &&
document.getElementsByTagName &&
document.getElementById &&
document.body ) alert(1)
&提示：您可以先修改部分代码再运行
照样alert出来
&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
&html xmlns=&http://www.w3.org/1999/xhtml&&
document.documentElement.doScroll(&left&);
&提示：您可以先修改部分代码再运行
显然doScroll才是正确的吧
而用defer 确实是另一个可行的方法（貌似ext就是用这种）不过要硬加一个script，这个看需要咯
[[i] 本帖最后由 cloudgamer 于
10:49 编辑 ]
UID353343在线时间 小时积分3781帖子离线17304 天注册时间
金牌会员, 积分 3781, 距离下一级还需 1219 积分
if ( document &&&&document.getElementsByTagName &&&&document.getElementById &&&&document.body )作为dom完成判断还是可行的。只不过在ie中可能会有一些hack成分,好像起作用的部分就是body对象的可用。
&html xmlns=&http://www.w3.org/1999/xhtml&&
if ( document &&
document.getElementsByTagName &&
document.getElementById &&
document.body ){alert(1);}
alert(!!document.body);
&div&1&/div&
&div&2&/div&
&div&3&/div&
&div&4&/div&
&div&5&/div&
&提示：您可以先修改部分代码再运行
UID387007在线时间 小时积分15775帖子离线17304 天注册时间
回复 21# zehee
document.body存在不代表dom完成
载入了body就为true了，后面都还没载入呢
显然还是达不到DOMContentLoaded的效果
可能你还没理解ready的意义吧
其实我上面的例子已经很清楚了
例如在alert的地方获取后面才定义的dom那肯定是获取不了的
如果判断document.body那到了alert的地方就已经运行了那肯定出错
用doScroll就能保证dom载入完整后才获取
[[i] 本帖最后由 cloudgamer 于
14:02 编辑 ]
UID495123在线时间 小时积分1259帖子离线17304 天注册时间
银牌会员, 积分 1259, 距离下一级还需 1741 积分
(function(){
& && & try {
& && && && &&&document.documentElement.doScroll(&left&);
& && & } catch( error ) {
& && && && &&&setTimeout( arguments.callee, 0 );
& && && && &&&
& && & }
& && & fun();
})();
复制代码
写入document.body是为了防止在IE下出现bug.&&如果要判断是否domReady try{}catch 这样才是可行的. 只是哪个timer比较消耗资源. 如果DOM真的比较大.而网速比较慢. 则会这样不停调用自己而得不到释放.
改一下,&&可能会性能好一点.
(function(){
& && & try {
& && && && &&&document.documentElement.doScroll(&left&);
& & & & & & & & & & & && &clearTimeout(arguments.callee.timer)
& & & & & & & & & & & && &arguments.callee.timer =
& && & } catch( error ) {
& && && && &&&arguments.callee.timer = setTimeout( arguments.callee, 0 );
& && && && &&&
& && & }
& && & fun();
})();复制代码
UID387007在线时间 小时积分15775帖子离线17304 天注册时间
回复 23# forbe
我倒觉得没这个必要
setTimeout是只运行一次
运行try的时候说明setTimeout已经在执行了这时clear也不需要了
UID327343在线时间 小时积分99帖子离线17304 天注册时间
初级会员, 积分 99, 距离下一级还需 101 积分
ready是dom解析完后执行，你使用
$(document).load(){
好像就行了
UID500494在线时间 小时积分28帖子离线17304 天注册时间
新手上路, 积分 28, 距离下一级还需 22 积分
原帖由 [i]yoyobp 于
05:17 发表
document.onload&&window.onload
没有本质的区别，都是指页面载入完成后执行指定函数
而jquery的ready则是指在页面的DOM模型加载完后执行指定的函数
ready肯定在onload之前发生，页面加载大或者多的图片而 ...
UID504092在线时间 小时积分22帖子离线17304 天注册时间
新手上路, 积分 22, 距离下一级还需 28 积分
我有个问题：$(document).ready里面设定了一些针对id=&aaa&的button事件， 那么当我用js输出一个id=“aaa”的button，ready里面的方法就失效了，不知道有什么解决方法没
UID17935在线时间 小时积分19080帖子离线17304 天注册时间
jq的ready是dom加载完成后就触发了，相当于把JS写在HTML后
&script&...&/script&
onload则是等待图片，乱七八糟加载完再没有http请求后触发
我是这样理解
Powered by　　还记不记得jQuery初始化函数jQuery.fn.init中有这样是一个分支
//document ready简便写法$(function(){&})
} else if ( jQuery.isFunction( selector ) ) {
return rootjQuery.ready( selector );
　　所以$(fn)===$(document).ready(fn)。
　　来看一下jQuery.fn.ready的源码
ready: function( fn ) {
// Add the callback
jQuery.ready.promise().done( fn );
return this;
　　很明显在jQuery.ready.promise函数中设置了延时，当延时对象解决的时候执行fn函数。
　　主要的处理流程：
　　创建一个延时对象，并将文档准备好后的处理事件添加到该延时对象成功事件列表上。
jQuery.ready.promise = function( obj ) {
　　if ( !readyList ) {
　　　　readyList = jQuery.Deferred();　　　　...　　}
return readyList.promise( obj );
　　添加文档准备状态的监听函数(jQuery.ready.promise函数片段)
//标准浏览器支持DOMContentLoaded事件
} else if ( document.addEventListener ) {
//绑定DOMContentLoaded事件和响应函数，响应函数会解决延时
document.addEventListener( "DOMContentLoaded", completed, false );
//回退到window.onload事件绑定，所有的浏览器都支持
window.addEventListener( "load", completed, false );
//如果是IE事件模型
//确保在onload之前执行延时，可能时间比较迟，但是对于iframes来说比较安全
document.attachEvent( "onreadystatechange", completed );
//回退到window.onload事件绑定，所有的浏览器都支持
window.attachEvent( "onload", completed );
//如果IE并且不是一个frame
//不断地检查，看是否该文件已准备就绪
var top = false;
top = window.frameElement == null && document.documentE
} catch(e) {}
if ( top && top.doScroll ) {
(function doScrollCheck() {
if ( !jQuery.isReady ) {
// Use the trick by Diego Perini
// /IEContentLoaded/
top.doScroll("left");
} catch(e) {
return setTimeout( doScrollCheck, 50 );
//移除之前绑定的事件
//执行延迟
jQuery.ready();
　　一旦监听到文档准备完成，则调用jQuery.ready执行延时对象的成功回调列表：即所有通过jQuery.ready(fn)【或jQuery(fn)】方式添加的函数fn。
//ready事件处理函数
completed = function( event ) {
// readyState === "complete"在老版本IE上适用
if ( document.addEventListener || event.type === "load" || document.readyState === "complete" ) {
jQuery.ready();
//清除ready事件绑定
detach = function() {
if ( document.addEventListener ) {
document.removeEventListener( "DOMContentLoaded", completed, false );
window.removeEventListener( "load", completed, false );
document.detachEvent( "onreadystatechange", completed );
window.detachEvent( "onload", completed );
//处理当DOM准备完成
jQuery.ready: function( wait ) { 　　 　　
... 　　　　 　　
//设置DOM已经准备好的标志 　　 　　
jQuery.isReady = true;
//执行绑定的延时事件 　　
readyList.resolveWith( document, [ jQuery ] ); 　　
//触发任何绑定的就绪事件 　　
if ( jQuery.fn.trigger ) { 　　　　
jQuery( document ).trigger("ready").off("ready"); 　　
&　　整个过程就是如此。其中有一些小的知识点整理一下。
a. 文档加载状态document.readyState
　　document.readyState用来判断文档加载状态，是一个只读属性，可能的值有：
　　0-uninitialized：XML 对象被产生，但没有任何文件被加载。　　1-loading：加载程序进行中，但文件尚未开始解析。　　2-loaded：部分的文件已经加载且进行解析，但对象模型尚未生效。　　3-interactive：仅对已加载的部分文件有效，在此情况下，对象模型是有效但只读的。　　4-complete：文件已完全加载，代表加载成功。
document.onreadystatechange = stateC//当页面加载状态改变的时候执行这个方法.
function stateChange() { 　　　　if(document.readyState == "complete"){ //当页面加载状态为完全结束时进入 　　　　　　　　alert("文档加载成功") 　　　　} }
　　但是，老版本的Firefox并不支持document.readyState【最新的Firefox已经支持了】。所以想要兼容所有浏览器监听文档准备完成分两种情况来处理：
　　- 标准浏览器使用addEventListener添加DOMContentLoaded和load监听，任何一个事件被触发即可
　　- 老版本IE浏览器使用attachEvent添加onreadystatechange和onload来监听，任何一个被触发，并且onreadystatechange时document.readyState === "complete"即可。
　　jQuery的处理也就是如此了
jQuery.ready.promise = function(){
　　...　　//标准浏览器支持DOMContentLoaded事件
　　else if ( document.addEventListener ) {
//绑定DOMContentLoaded事件和响应函数，响应函数会解决延时
document.addEventListener( "DOMContentLoaded", completed, false );
//回退到window.onload事件绑定，所有的浏览器都支持
window.addEventListener( "load", completed, false );
//如果是IE事件模型
//确保在onload之前执行延时，可能时间比较迟，但是对于iframes来说比较安全
document.attachEvent( "onreadystatechange", completed );
//回退到window.onload事件绑定，所有的浏览器都支持
window.attachEvent( "onload", completed );　　　　　　　...
//ready事件处理函数
completed = function( event ) {
// readyState === "complete"在老版本IE上适用
if ( document.addEventListener || event.type === "load" || document.readyState === "complete" ) {
jQuery.ready();
b.doScroll检测文档加载完成
　　这是Diego Perini 发现的一种检测IE是否加载完成的方式。
　　原理是当页面 DOM 未加载完成时调用 doScroll 方法时会产生异常。那么不断的取检测异常是否发生就可以知道文档有没有加载完成。当没有发生异常，表明文档加载完成了。
(function doScrollCheck() {
if ( !jQuery.isReady ) {
// Use the trick by Diego Perini
// /IEContentLoaded/
top.doScroll("left");
} catch(e) {
return setTimeout( doScrollCheck, 50 );
//移除之前绑定的事件
//执行延迟
jQuery.ready();
　　如果觉得本文不错，请点击右下方【推荐】！
阅读(...) 评论()jQuery 事件 - ready() 方法
jQuery 事件 - ready() 方法
在文档加载后激活函数：
$(document).ready(function(){
$(&.btn1&).click(function(){
$(&p&).slideToggle();
定义和用法
当 DOM（文档对象模型） 已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。
由于该事件在文档就绪后发生，因此把所有其他的 jQuery 事件和函数置于该事件中是非常好的做法。正如上面的例子中那样。
ready() 函数规定当 ready 事件发生时执行的代码。
ready() 函数仅能用于当前文档，因此无需选择器。
允许使用以下三种语法：
$(document).ready(function)
$().ready(function)
$(function)
必需。规定当文档加载后要运行的函数。
提示和注释
提示：ready() 函数不应与 &body onload=&&& 一起使用。jQuery:理解$(document).ready()的特殊写法
时注意到下面两条语句的功效是相同的，
$(function(){alert(&hello!&);}); &
$(document).ready(function(){alert(&hello!&);});&
这个特殊写法就是用$()代替$(document).ready()，类似于(有差异)window.onload弹出个窗口：
查看jQuery1.8.3源代码，是这样封装的：
(function( window, undefined ) { &
& & /*...jQuery源代码全部都在这里了...*/&
})( window ); &
下列语句把封装在内部的jQuery先赋给window.$，紧接着再赋给window.jQuery。这意味着在实际使用时window.$和window.jQuery是一回事。因为$这个符号只有1个字母，比jQuery短，所以更常用一些，但要注意到$非jQuery所独有，节约字母的代价是增加了命名冲突的风险。
// Expose jQuery to the global object &
window.jQuery = window.$ = jQ&
下面是jQuery的初始化语句（注意到此时函数并未执行）：
// Define a local copy of jQuery &
jQuery = function( selector, context ) { &
& & // The jQuery object is actually just the init constructor 'enhanced' &
& & return new jQuery.fn.init( selector, context, rootjQuery ); &
找到jQuery.fn的定义，这是一个对象，其中有一个叫init的函数元素：&
jQuery.fn = jQuery.prototype = { &
& & constructor: jQuery, &
& & init: function( selector, context, rootjQuery ) { &
& & & & var match, elem, ret, &
& & & & // Handle $(&&), $(null), $(undefined), $(false) &
& & & & if ( !selector ) { &
& & & & & & &
& & & & } &
& & & & // Handle $(DOMElement) &
& & & & if ( selector.nodeType ) { &
& & & & & & this.context = this[0] = &
& & & & & & this.length = 1; &
& & & & & & &
& & & & } &
/*...以下省略...*/&
继续下去，init中有一段逻辑：
// HANDLE: $(function) &
// Shortcut for document ready &
} else if ( jQuery.isFunction( selector ) ) { &
& & return rootjQuery.ready( selector ); &
晕了晕了，rootjQuery的定义又回到了jQuery：
// All jQuery objects should point back to these &
rootjQuery = jQuery(document);&
有点递归的意思了，嗯，就是递归。jQuery不仅仅是一个函数，而且还是一个递归函数。
如果调用jQuery时输入的是一个函数，例如文章开头提到的：
$(function(){alert(&hello!&);});&
那么这个函数就会走到rootjQuery那里，再回到jQuery，执行jQuery(document).ready。而$与jQuery是一回事，这样就解释了$(inputFunction)可以代替$(document).ready(inputFunction)。
现在还不想结束此文，我的问题是$(document)做了什么？嗯，还是要进入到jQuery.fn.init，确认存在nodeType属性，达到&Handle $(DOMElement)&的目的。怎么Handle呢？具体就是把输入参数（此时为document）赋值给this的context属性，然后再返回this。也就是说，$(document)执行完了返回的还是jQuery，但是情况发生了变化，具体就是context属性指向了输入参数（此时为document）。暂时还不明白绕这么大个圈子为context（上下文）属性赋值有何意义？
接下去的问题可能会是$(document).ready和window.onload的区别？提取ready函数的定义如下：
ready: function( fn ) { &
& & // Add the callback &
& & jQuery.ready.promise().done( fn ); &
代码探究promise是有点晕啊，想到自己的iJs工具包了，打印jQuery.ready.promise()如下：
& & [Object] jQuery.ready.promise()
& & & & |--[function] always
& & & & |--[function] done
& & & & |--[function] fail
& & & & |--[function] pipe
& & & & |--[function] progress
& & & & |--[function] promise
& & & & |--[function] state
& & & & |--[function] then
进一步打印整理done函数代码如下（这下彻底晕了~~）：
function() { &&
& & if ( list ) { &&
& & & & // First, we save the current length &&
& & & & var start = list. &&
& & & & (function add( args ) { &&
& & & & & & jQuery.each( args, function( _, arg ) { &&
& & & & & & & & var type = jQuery.type( arg ); &&
& & & & & & & & if ( type === &function& ) { &&
& & & & & & & & & & if ( !options.unique || !self.has( arg ) ) { list.push( arg ); } &&
& & & & & & & & } else if ( arg && arg.length && type !== &string& ) { &&
& & & & & & & & & & // Inspect recursively add( arg ); &&
& & & & & & & & } &&
& & & & & & }); &&
& & & & })( arguments ); &&
& & & & // Do we need to add the callbacks to the &&
& & & & // current firing batch? &&
& & & & if ( firing ) { &&
& & & & & & firingLength = list. &&
& & & & & & // With memory, if we're not firing then &&
& & & & & & // we should call right away &&
& & & & } else if ( memory ) { &&
& & & & & & firingStart =&
　　　　　　　fire( memory ); &&
& & & & } &&
好在代码不长，看起来关键就在于fire函数了。嗯，找回一丝清醒了。在上面的done函数里面可以注意到使用了默认的arguments变量，将注入的函数push到了list数组。下面是fire函数：
fire = function( data ) { &
& & memory = options.memory && &
& & fired = &
& & firingIndex = firingStart || 0; &
& & firingStart = 0; &
& & firingLength = list. &
& & firing = &
& & for ( ; list && firingIndex & firingL firingIndex++ ) { &
& & & & if ( list[ firingIndex ].apply( data[ 0 ], data[ 1 ] ) === false && options.stopOnFalse ) { &
& & & & & & memory = // To prevent further calls using add &
& & & & & & &
& & & & } &
& & firing = &
& & if ( list ) { &
& & & & if ( stack ) { &
& & & & & & if ( stack.length ) { &
& & & & & & & & fire( stack.shift() ); &
& & & & & & } &
& & & & } else if ( memory ) { &
& & & & & & list = []; &
& & & & } else { &
& & & & & & self.disable(); &
& & & & } &
可以看到代码中对list数组里面使用了apply。用iJs包调试可发现data[0]就是document对象，也就是说，调用$(myFunction)的结果是在document对象上执行了myFunction。因为list是个数组，所以也就不难理解$()其实是多次输入，一次执行。
最后，回过头来阅读promise源代码，关于$()输入函数的执行时机的秘密就在这里了：
jQuery.ready.promise = function( obj ) { &
& & if ( !readyList ) { &
& & & & readyList = jQuery.Deferred(); &
& & & & // Catch cases where $(document).ready() is called after the browser event has already occurred. &
& & & & // we once tried to use readyState &interactive& here, but it caused issues like the one &
& & & & // discovered by ChrisS here: /ticket/12282#comment:15 &
& & & & if ( document.readyState === &complete& ) { &
& & & & & & // Handle it asynchronously to allow scripts the opportunity to delay ready &
& & & & & & setTimeout( jQuery.ready, 1 ); &
& & & & // Standards-based browsers support DOMContentLoaded &
& & & & } else if ( document.addEventListener ) { &
& & & & & & // Use the handy event callback &
& & & & & & document.addEventListener( &DOMContentLoaded&, DOMContentLoaded, false ); &
& & & & & & // A fallback to window. &
& & & & & & window.addEventListener( &load&, jQuery.ready, false ); &
& & & & // If IE event model is used &
& & & & } else { &
& & & & & & // Ensure firing before &&
& & & & & & document.attachEvent( &onreadystatechange&, DOMContentLoaded ); &
& & & & & & // A fallback to window. &
& & & & & & window.attachEvent( &onload&, jQuery.ready ); &
& & & & & & // If IE and not a frame &
& & & & & & // continually check to see if the document is ready &
& & & & & & var top = &
& & & & & & try { &
& & & & & & & & top = window.frameElement == null && document.documentE &
& & & & & & } catch(e) {} &
& & & & & & if ( top && top.doScroll ) { &
& & & & & & & & (function doScrollCheck() { &
& & & & & & & & & & if ( !jQuery.isReady ) { &
& & & & & & & & & & & & try { &
& & & & & & & & & & & & & & // Use the trick by Diego Perini &
& & & & & & & & & & & & & & // /IEContentLoaded/ &
& & & & & & & & & & & & & & top.doScroll(&left&); &
& & & & & & & & & & & & } catch(e) { &
& & & & & & & & & & & & & & return setTimeout( doScrollCheck, 50 ); &
& & & & & & & & & & & & } &
& & & & & & & & & & & & // and execute any waiting functions &
& & & & & & & & & & & & jQuery.ready(); &
& & & & & & & & & & } &
& & & & & & & & })(); &
& & & & & & } &
& & & & } &
& & return readyList.promise( obj ); &
从代码的注释中可以看到这段代码在消除bug的过程中还是颇费了些心思的。查看其中一个网址/ticket/12282#comment:15，是关于IE9/10的一个bug（document ready is fired too early on IE 9/10），好在已经解决。
绕了这么多弯子，整个事情看起来就是这样，如果每一个都能有document.readyState === &complete&，就简单了。再看到$()，要感谢编写jQuery的大神们（以及其他类似框架的大神们），是他们的努力，让世界变得完美。}