概览
(function (){
(21 , 94) 定义了一些变量和函数 jQuery=function();
(96 , 293) 给jQuery对象添加一些方法和属性;
(285 , 347) extend:jQuery扩展方法;
(349 , 817) jQuery.extend : 扩展一些工具方法;
(877 , 2856 ) Sizzle : 复杂选择器的实现;
(2880, 3042 ) Callbacks : 回调对象：函数的统一管理
(3043, 3183 ) Deferred : 延迟对象：对异步的统一管理
(3184, 3295) support : 浏览器功能检测，确定浏览器对某些功能是否支持
(3380, 3652) data() : 数据缓存功能
(3653, 3797) queue()/dequeue() : 队列管理
(3803, 4299) attr() prop() val() addClass()等方法，对元素属性的操作
(4300, 5138) on() trigger()等方法，事件相关的方法，事件管理
(5140，6057) DOM操作：添加 删除 包装 获取 DOM筛选
(6058, 6620) css() ： 样式操作
(6621, 7854) 提交的数据和Ajax()操作:ajax() load() getJson()
(7855, 8584) animite() : 运动的方法
(8585, 8792) offset() :位置与尺寸的方法
(8804, 8821) JQuery对模块化的支持
(8826) window.jQuery = window.$ = jQuery;//对外提供的接口
})();
匿名函数 :14
(function (window,undefined){
})(window)
为什么传入window
对压缩和查找都有利
为什么传入undefined
防止undefined在外部被修改
严格执行 :20
'use strict'
低版本不支持，.net跟踪不支持。根据项目选型决定是否开启。
rootjQuery ：23
rootjQuery=jQuery(document);//:866
为了压缩，可维护
core_strundefined ：30
core_strundefined=typeof undefined
为了支持 IE9,从而使用type of xmlNode.method代替xmlNode.method !==undefined
变量存储 :33
location = window.location //:33 document=window.document docElem=document.documenttElement core_concat = core_deletedIds.concat, //:52 core_push = core_deletedIds.push, core_slice = core_deletedIds.slice, core_indexOf = core_deletedIds.indexOf, core_toString = class2type.toString, core_hasOwn = class2type.hasOwnProperty, core_trim = core_version.trim,
防冲突 ：38
_jQuery=window.jQuery _$=window.$
class2type={} :44
$.tpye() 会用到，clas2type形如 {'[objectt String]'}
core_version="2.0.3" :49
版本号
jQuery声明
最终$()调用的是这个
//:61
jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context, rootjQuery );
},
jQuery 原型
//:96
jQuery.fn = jQuery.prototype = {
jquery: core_version,
constructor: jQuery,
init: function( selector, context, rootjQuery ) {...}
}
//:283
jQuery.fn.init.prototype = jQuery.fn;
实际上jQuery.prototype.init.prototype = jQuery.prototype。之后的的代码就可以写成颗粒化的调用操作，形如jQuery().css()。
通用正则
数字
//:67 core_pnum = /[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,
非空字符，比如单词
core_rnotwhite = /\S+/g,
html标签
防止通过location.hash的XSS注入(#9521)
rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/,
独立空标签
比如 <p></p>
rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>|)$/,
IE驼峰转换
-ms-aaa-bbb转换成MsAaaBbb
rmsPrefix = /^-ms-/,
普通驼峰转换
rdashAlpha = /-([\da-z])/gi,
jQuery.prototype ：98
jquery：版本 ：100
jquery: core_version,
constructor:修正指向问题
constructor: jQuery,
不写容易被修改，例如
//Aaa
Aaa.prototype.name='hello'
Aaa.prototype.age=30
//Object
AAA.prototype={
name:'hello',
age：30
}
init:初始化和参数管理 ：101
对传入的参数分别处理
忽略的
$(""), $(null), $(undefined), $(false)
字符的
if 字符左侧是`<`且右侧是`>`且长度 大于3
//$('<li>') $('<li>1</li><li>2</li>')
match=[null,'<li>',null]
else
match=null //$('.box') $('div') $('#div1 div.box')
match=['$#div1',null,'div1']//$('#div1')
match=['<li>hello','<li>',null] $('<li>hello')
if ( match && (match[1] || !context) ) {// :120
//$('<li>') $('#div1')
if(match[1]){
//HANDLE: $(html) -> $(array)
使用jQuery.parseHTML将html代码转数组
使用jQuery.merge将json转数组
// HANDLE: $(html, props)
if ( rsingleTag.test( match[1] ) && jQuery.isPlainObject( context ) )
}else{
//HANDLE: $(#id) ：151
elem = document.getElementById( match[2] );
//黑莓4.6兼容代码 ：155
}
// HANDLE: $(expr, $(...))
}else if ( !context || context.jquery ) {
// HANDLE: $(expr, context) 例如 $(context).find(expr)
} else {
}
// HANDLE: $(DOMElement)
else if ( selector.nodeType ) {
// HANDLE: $(function)
else if ( jQuery.isFunction( selector ) ) {
jQuery.makeArray 将dom集合转数组或对象
selector:存储选择字符串
length：this对象的长度
toArray():转数组 :202
return core_slice.call( this );
$('div'):{0:div,1:div,length:2} =>[div,div]
实际是调用slice
get():转原生集合 :208
根据num返回全部或其中某个元素
get: function( num ) {
return num == null ?
this.toArray() :
( num < 0 ? this[ this.length + num ] : this[ num ] );
},
pushStack():jQ对象入栈 :220
一个栈里放1个jQ对象，1个jQ对象包含1个或多个dom
each():遍历集合 :236
工具方法jQuery.each
ready():DOM加载的接口 :240
工具方法jQuery.reday.promise.done(fn)
slice():集合的截取 :247
栈操作 this.pushStack( core_slice.apply( this, arguments ) );
first():集合的第一项
this.eq( 0 )
last():集合的最后一项
this.eq( -1 )
eq():集合的指定项
map():返回新集合
return this.pushStack( jQuery.map(this, function( elem, i ) {
return callback.call( elem, i, elem );
}));
end():返回集合前一个状态
return this.prevObject || this.constructor(null);
push(): 内部使用
core_push
sort(): 内部使用
[].sort,
splice(): 内部使用
splice: [].splice
jQuery.extend
拷贝方法 :285
定义一些变量
if(){} 看是不是深拷贝情况
if(){} 看参数正确不
if(){} 看是不是插件情况
for(){ 可能有多个对象情况
if(){} 防止循环引用
if(){} 深拷贝
else if(){} 浅拷贝
}
防止循环引用
if ( target === copy ) {
continue;
}
深拷贝
if ( copyIsArray ) {
copyIsArray = false;
clone = src && jQuery.isArray(src) ? src : [];
} else {
clone = src && jQuery.isPlainObject(src) ? src : {};
}
// Never move original objects, clone them
target[ name ] = jQuery.extend( deep, clone, copy );
浅拷贝
target[ name ] = copy;
工具方法
jQuery.extend({
expando:生成唯一jQ字符串(内部)
noConflict():防止冲突
isReady: dom是否加载完(内部)
readyWait:等待多少文件的计数器(内部)
holdReady(): 推迟dom触发
ready():准备dom触发
isFunction():是否为函数
isArray():是否为数组
isWindow():是否为window
isNumberic():是否为数字
type():判断数据类型
isPlainObjeect():是否为对象自变量
isEmptyObject():是否为空的对象
error():抛出异常
parseHTML():解析节点
parseJSON():解析JSON
parseXML():解析XML
noop():空函数
globalEval():全局解析js
})
expando 唯一映射 :351
生成唯一jQuery字符串,做映射关系用
expando: "jQuery" + ( core_version + Math.random() ).replace( /\D/g, "" ),
noConflict 防止冲突 :353
if ( window.$ === jQuery ) {
window.$ = _$;
}
if ( deep && window.jQuery === jQuery ) {
window.jQuery = _jQuery;
}
return jQuery;
dom加载相关
jQuery.ready.promise
if ( document.readyState === "complete" ) {
// 防止Ie的提前执行
setTimeout( jQuery.ready );
} else {
// 若dom加载了则执行，否则监听完成后执行
document.addEventListener( "DOMContentLoaded", completed, false );
window.addEventListener( "load", completed, false );
}
readyList
holdReady(hold) :373
为true时执行ready，否则readyWait计数
if ( hold ) {
jQuery.readyWait++;
} else {
jQuery.ready( true );
}
ready(wait) :382
//如果有wait，或者ready，中止
if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
return;
}
jQuery.isReady = true;
// 如果被触发，那么递减，如果需要则等待
if ( wait !== true && --jQuery.readyWait > 0 ) {
return;
}
//如果有函数绑定，则执行。
readyList.resolveWith( document, [ jQuery ] );
// 触发任何绑定事件
if ( jQuery.fn.trigger ) {
jQuery( document ).trigger("ready").off("ready");
}
type(obj) :423
if ( obj == null ) {
return String( obj );
}
// 兼容: Safari <= 5.1
return typeof obj === "object" || typeof obj === "function" ?
class2type[ core_toString.call(obj) ] || "object" :
typeof obj;
isWindow(obj) :415
不为空且window属性相同(undefined 没有属性)
return obj != null && obj === obj.window;
isNumeric(obj) :417
typeof NaN 或 finite ==='number'
return !isNaN( parseFloat(obj) ) && isFinite( obj );
parseHTML(data, context, keepScripts) :475
//校验输入 parsed=正则匹配data //单标签 return context.createElement( parsed[1] ) //多标签 //判断是否保留script parsed = jQuery.buildFragment( [ data ], context, scripts ) return jQuery.merge( [], parsed.childNodes );
globalEval(code) :528
直接调用eval无法全局访问，必须先赋值
var indirect = eval;
if 'use strict'
createElement
document.head.appendChild( script ).parentNode.removeChild( script )
else
indirect(code)
camelCase :552
修正IE,驼峰转换
return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase )
nodeName( elem, name ) :556
全转小写判断是否相同
return elem.nodeName && elem.nodeName.toLowerCase() === name.toLowerCase();
each( obj, callback, args ) :561
i=0
length=obj.length //若json则不存在
isArray=isArraylike(obj)
if isArray
for(;;)
callback.call
else
for in
callback.call
makeArray :615
类数组转数组
if isArraylike( Object(arr)
jQuery.merge
else
core_push
inArray( elem, arr, i ) :632
indexOf
return arr == null ? -1 : core_indexOf.call( arr, elem, i );
merge( first, second ) :636
获取2个变量的length
if 非json
for
first[ i++ ] = second[ j ]
else
while
first[ i++ ] = second[ j++ ]
grep( elems, callback, inv ) :656
过滤新数组
for
retVal = !!callback( elems[ i ], i )
if inv !== retVal
ret.push( elems[ i ] )
map( elems, callback, arg ) :676
//分别处理arr 和json
for
value = callback( elems[ i ], i, arg );
if ( value != null ) {
ret[ ret.length ] = value;
}
return core_concat.apply( [], ret );
proxy( fn, context ) :713
context 若是string
content=fn(content)
return function(){
return fn.apply( context || this, args.concat( core_slice.call( arguments ) ) )
}
proxy.guid = fn.guid = fn.guid || jQuery.guid++
access( elems, fn, key, value, chainable, emptyGet, raw ) :742
elems $('#div1')
fn 回调函数
key,value {background:'red'}
if type(key) ==='object'
for
access
else if value !== undefined
//空
//非函数
//函数
swap( elem, options, callback, args ) :798
设置display可见
设置visibility:hidden
获取样式
属性再转回去
isArraylike(obj) :848
判断不是window
nodeType==1&&length #是节点 返回true
return type === "array"
||type !== "function"
&&( length === 0
||typeof length === "number"
&& length > 0
&& ( length - 1 ) in obj )
createOptions(options)
将'once memory'=>{once:true,memory:true}
each
obj[flag]=true
jQuery.Callbacks(options) :2880
once// fire for list
memory//add()时直接执行
unique//重复函数，add()时判断去重
stopOnFalse//fire for list
add(arg)
分别判断arg=aaa
arg=aaa,bbb
arg=[aaa,bbb]
if menory==true
fire
remove(arg) :2965
分隔数组
has(fn) :2987
jQuery.InArray
fireWith(context,args) :3018
if list && ( !fired || stack )
if firing
stack.push(args)
else
fire(args)
Deferred(func) :3045
异步操作,延迟对象，基于$.Callbacks()
$.ajax(url).done(=>resolve).fail(=>reject)
"resolve", "done", jQuery.Callbacks("once memory"), "resolved"
成功
resolve=>fire
done=>add
"reject", "fail", jQuery.Callbacks("once memory"), "rejected"
失败
reject=>fire
fail=>add
"notify", "progress", jQuery.Callbacks("memory")
notify=>fire
progress =>add
when() 批量延迟：3133
内部有个计数器，当$.when(a(),b(),c()) 中的arguments.length随着done()后减少到0,实际执行$.Deferred->resolve()
参数必须返回deferred延迟对象，不然则跳过该项。
support 功能检测:3184
统一兼容性问题。
checkOn复选框value值
老版本chrome是‘’，新的是‘on’
optSelected下拉菜单子项第一项选中
ie不会选中
noCloneChecked 克隆复选框的选中状态
ie9,10没有选中
focusinBubbles 选中的冒泡机制
data 数据缓存 :3308
key 自定义属性，<div JQueryxxxx="x"> set，get，access，remove，hasData，discard