- 整个文档是一个自执行函数,下面大致列出了个人理解的jQuery框架结构:
(function (global, factory) {
...
factory(global);
}) (typeof window !== 'undefined' ? window : this, function (window, noGlobal) {
// global如果不是window,则是运行jquery代码环境的global
...
//jQuery的定义, selector即使用$(selector)获取元素时传入的值,在jQuery.fn.init中处理
v = function (selector, context) {
return new jQuery.fn.init(selector, context);
}
//定义jQuery原型
jQuery.fn = jQuery.prototype = {
...
}
//jQuery生成API各种方法的函数,自定义jQuery插件也是使用这个方法生成的
jQuery.extend = jQuery.fn.extend = function () {
...
}
//生成各种API方法,在jQuery中大量使用,整个jQuery的API就是这样产生的
jQuery.extend({ ... });
jQuery.fn.extend({ ... });
//jQuery.fn.init方法
jQuery.fn.init = function (selector, context, root) {
// 排除:$(""), $(null), $(undefined), $(false)这些参数
if ( !selector ) {
return this;
}
if (type selector === 'string') {
//处理参数为字符串的各种情况
...
} else if (selector.nodeType) {
//处理参数为DOM元素的情况
...
} else if (isFuntion(selector)) {
//处理参数为函数的情况,不传root就是立即执行该函数,传入root的情况还未研究
return root.ready !== undefined ? root.ready( selector ) : selector( jQuery );
}
}
...
//window中使用jQuery,$可以代替jQuery
window.jQuery = window.$ = jQuery;
})