JQuery1.4.2的ondomready分析

window.onload 应该都知道了，不过此事件要在DOM完全加载完毕，包括图片都加载完毕才触发，如果我们有事情需要注册到onload上，有时恐怕得等到黄瓜菜都凉了。于是这时 DOMContentLoaded 翩翩而来，此事件在 DOM 加载完毕(不包括图片都加载完毕)后触发，正合要求，但很不幸的是此事件IE不支持。下面来看看JQuery的如何解决这个问题，废话不说，直接看代码

	ready: function( fn ) {
		// 绑定监听
		jQuery.bindReady();

		// 如果 DOM 加载完毕
		if ( jQuery.isReady ) {
			// 立即执行方法
			fn.call( document, jQuery );

		// 否则，将需要执行的方法保存起来
		} else if ( readyList) {
			// 保存方法到 list 中
			readyList.push( fn );
		}
		return this;
	}

那么看看这个 bindReady 方法

	bindReady: function() {
                // 设置是否已经绑定的标识符
		if ( readyBound ) {
			return;
		}

		readyBound = true;

		// 如果文档加载完毕，执行注册保存的方法
		if ( document.readyState === "complete" ) {
			return jQuery.ready();
		}

		// Mozilla, Opera 和 webkit nightly 之流的浏览器支持 DOMContentLoaded 事件
		if ( document.addEventListener ) {
			document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );
			
			// 如果注册 DOMContentLoaded 事件句柄失败，注册到 window 的 onload 上作为后手
			window.addEventListener( "load", jQuery.ready, false );

		// 如果是传说中万恶的 IE
		} else if ( document.attachEvent ) {
			// 如果是 iframe, 绑定到 onreadystatechange, 会在 window.onload 前触发
			document.attachEvent("onreadystatechange", DOMContentLoaded);
			
			// 同样注册到 onload 上作为后手
			window.attachEvent( "onload", jQuery.ready );

			// 如果不是一个 iframe，检查 DOM 是否加载完毕
			var toplevel = false;

			try {
				toplevel = window.frameElement == null;
			} catch(e) {}

			if ( document.documentElement.doScroll && toplevel ) {
                          // 在此方法中检查 DOM 是否加载完毕
				doScrollCheck();
			}
		}
	}

最后看看 doScrollCheck 方法是何方神圣。

// 检查 DOM 是否加载完成，与 DOMContentLoaded 事件类似
function doScrollCheck() {
        // 再次判断一下
	if ( jQuery.isReady ) {
		return;
	}

	try {
		// 如果是IE，使用 Diego Perini 的一个 hack 技术，原理是执行 doScroll方法，如果可执行说明 DOM 加载完毕
		// http://javascript.nwbox.com/IEContentLoaded/
		document.documentElement.doScroll("left");
	} catch( error ) {
                // 如果未加载完毕，轮询之
		setTimeout( doScrollCheck, 1 );
		return;
	}

	// 执行注册保存的方法
	jQuery.ready();
}