jquery事件的ready()方法使用详解

页面初始化中，用的较多的就是$(document).ready(function(){//代码}); 或 $(window).load(function(){//代码});

他们的区别就是，ready是在DOM的结构加载完后就触发，load是在页面内包括DOM结构，css，js，图片等都加载完成后再触发，显然ready更适合作为页面初始化使用。但有时候也不尽然。需要进一步查看其内部机制。

那么ready的内部是如何判断DOM的结构加载完的？并且不同的浏览器的判断是如何的？

答案就在jquery代码内，假设jquery的版本是jquery-1.11.3.js。

ready的关键代码（3507~3566行），关键代码用红色标出：

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: http://bugs.jquery.com/ticket/12282#comment:15
if ( document.readyState === “complete” ) {
// Handle it asynchronously to allow scripts the opportunity to delay ready
setTimeout( jQuery.ready );

// Standards-based browsers support DOMContentLoaded
} else if ( document.addEventListener ) {
// Use the handy event callback
document.addEventListener( “DOMContentLoaded”, completed, false );

// A fallback to window.onload, that will always work
window.addEventListener( “load”, completed, false );

// If IE event model is used
} else {
// Ensure firing before onload, maybe late but safe also for iframes
document.attachEvent( “onreadystatechange”, completed );

// A fallback to window.onload, that will always work
window.attachEvent( “onload”, completed );

// If IE and not a frame
// continually check to see if the document is ready
var top = false;

try {
top = window.frameElement == null