jQuery 的核心分为
jQuery 核心函数
jQuery 对象访问
数据缓存
队列控制
插件机制
多库共存
之前分析了核心函数,有太多的不明白.今天分析了 对象访问,插件机制? .jQuery1.4.1.js 和API 下载 .
/* * jQuery1.4.1 代码分析 isw2 zhoux */ //jQuery 插件机制 jQuery.fn = jQuery.prototype = {}//声明 jQuery.fn 是jQuery.prototype 的简写 jQuery.fn.init.prototype = jQuery.fn;//jQuery.fn.init 继承 jQuery.fn的所有方法(JavaScript中属性动态) jQuery.extend = jQuery.fn.extend = function() {//从这里可以看出jQuery.fn.extend 和 jQuery.extend 是样的,两者只是调用对象不同,jQuery.fn(即jQuery.prototype),jQuery //arguments 代表传入参数,arguments[0]即第1个参数 //javaScript 里没有块定义,这里用到变量在方法开始处声明 var target = arguments[0] || {}, i = 1, length = arguments.length, deep = false, options, name, src, copy; if ( typeof target === "boolean" ) {//标记是否深入复制属性 deep = target;//标记是否需要深入复制属性 target = arguments[1] || {};//{}简写的方法一个新的对象 i = 2; } if ( typeof target !== "object" && !jQuery.isFunction(target) ) {// target为非对象,非函数 target = {}; } if ( length === i ) { target = this;//如果jQuery.fn.extend,this代jQuery.fn(即jQuery.prototype);如果是jQuery.extend 则this代jQuery --i; } for ( ; i < length; i++ ) { if ( (options = arguments[ i ]) != null ) {//仅处理 non-null/undefined (javascript 中 != null 包扩undefined) for ( name in options ) { src = target[ name ]; copy = options[ name ]; if ( target === copy ) {//防止死循环 continue; } if ( deep && copy && ( jQuery.isPlainObject(copy) || jQuery.isArray(copy) ) ) {//如果copy 的值是一个object 或数组,且deep == true var clone = src && ( jQuery.isPlainObject(src) || jQuery.isArray(src) ) ? src : jQuery.isArray(copy) ? [] : {}; target[ name ] = jQuery.extend( deep, clone, copy );//递归 } else if ( copy !== undefined ) {//不能使用undefined 的值 target[ name ] = copy; } } } } return target;//返回修改后的值 }; jQuery.extend();// 针对jQuery 方法(类),扩展jQuery对象本身。 jquery.fn.extend();//针对jQuery 对象,扩展 jQuery 元素集来提供新的方法(通常用来制作插件)。 //jQuery 对象访问 jQuery.fn = jQuery.prototype = { each: function( callback, args ) {//$().each return jQuery.each( this, callback, args ); }, size: function() { return this.length; }, length: 0, selector: "", get: function( num ) {//如果num == null || num < 0 返回Array.slice[0]即所有元素,否则根据num 返回($(**).[num]为简写,此方法用于获DOM 对象) return num == null ? this.toArray() : ( num < 0 ? this.slice(num)[ 0 ] : this[ num ] ); }, } jQuery.fn.extend({ index: function( elem ) { if ( !elem || typeof elem === "string" ) {//为字符串或空 //如果是字符串使用jQuery 查找对象然后查找位置,如果是空则返回这个元素在同辈中的索引位置 return jQuery.inArray( this[0], elem ? jQuery( elem ) : this.parent().children() ); } //如果是jQuery 对象则从[0]查找,否则当作对象处理 return jQuery.inArray( elem.jquery ? elem[0] : elem, this ); } }); jQuery.fn.init.prototype = jQuery.fn; jQuery.extend = jQuery.fn.extend = function() {} jQuery.extend({ each: function( object, callback, args ) {//$.each,参数args仅在内部使用 var name, i = 0, length = object.length, isObj = length === undefined || jQuery.isFunction(object);//这里用length 区分是对象还是数组(对象没有length 属性) if ( args ) {//如果args 有值 if ( isObj ) {//如果是对象 for ( name in object ) { if ( callback.apply( object[ name ], args ) === false ) { break; } } } else {//如果是数组 for ( ; i < length; ) { if ( callback.apply( object[ i++ ], args ) === false ) { break; } } } } else { if ( isObj ) { for ( name in object ) { if ( callback.call( object[ name ], name, object[ name ] ) === false ) { break; } } } else { for ( var value = object[0]; i < length && callback.call( value, i, value ) !== false; value = object[++i] ) {} } } return object; }, inArray: function( elem, array ) { if ( array.indexOf ) {//如果 array 有indexOf 属性直接使用 return array.indexOf( elem ); } for ( var i = 0, length = array.length; i < length; i++ ) { if ( array[ i ] === elem ) { return i;//返回所处位置, } } return -1;//返回-1 表示不存在 } })?
?