与jQuery事件模块的其他事件不同，其他事件是通过数据缓存实现的，而初始化事件，jQuery.ready则是通过回调函数列表实现的。$()的参数如果是函数就向回调函数列表中添加回调函数，同时为DOMContentLoaded注册事件，在注册的事件处理函数中，触发resolve事件。
以下是对jQuery源代码中的ready事件进行了简化的代码。具体如下：
1.定义了jQuery.ready.promise.功能及代码实现如下：
//jQuer的DOM页面加载通过回调函数列表完成
//下面的函数：1）初始化一个回调函数列表
//2）向DomContentLoaded注册监听事件
jQuery.ready.promise=function(obj){
if(!readyList){
readyList=jQuery.Defered();
document.addEventListener('DOMContentLoaded',compeleted,false);
}
return readyList.promise(obj);
};
2.向document的DOMContentLoaded注册的监听函数compeleted代码如下：
compeleted=function(){
document.removeEventListener('DOMContentListener',compeleted,false);
jQuery.ready();
};
3.上述代码中的jQuery.ready（）实际上完成了回调函数列表的触发操作，具体如下：
jQuery.extend({
// Handle when the DOM is ready
ready: function( wait ) {
// If there are functions bound, to execute
readyList.resolveWith( document, [ jQuery ] );
// Trigger any bound ready events
// if ( jQuery.fn.trigger ) {
// jQuery( document ).trigger("ready").off("ready");
// }
},
});
4.在初始化函数中，为回调函数列表添加加载成功的触发函数，如下所示：(实际上源代码调用了.ready方法，不过实际上就是封装了以下代码)
jQuery.fn.extend({
init: function( selector, context, rootjQuery ) {
// Handle HTML strings
if ( typeof selector === "string" ) {
} else if ( jQuery.isFunction( selector ) ) {
jQuery.ready.promise().done(selector);
return this;
}
},
如此就能够保证，当页面加载完成时间DOMContentLoaded事件触发的时候，回调函数能够依次执行。
版权声明：除特别声明外，本站所有文章皆是本站原创，转载请以超链接形式注明出处！
