学习一段时间了,算是总结一下吧.有部分暂时不能完全看明白.用"?"标出
/* * jQuery1.4.1 代码分析 isw2 zhoux */ //jQuery 核心函数 (function( window, undefined ) { var jQuery = function( selector, context ) {// jQuery 的构造方法(初始化过程调用4次) return new jQuery.fn.init( selector, context );// 调用init 方法 }; jQuery.fn = jQuery.prototype = {// 这里声明jQuery.fn 是jQuery.prototype 的简写 init: function( selector, context ) { if ( !selector ) {// jQuery(),$():返回空jQuery 对象 return this; } if ( selector.nodeType ) {// jQuery(elements),$(elements):调用将DOM元素转化为jQuery对象。 this.context = this[0] = selector; this.length = 1; return this; } if ( typeof selector === "string" ) {// 这里注意==(等于,比较时会转型)和===(完全等于,比较时不会转型)的区别 match = quickExpr.exec( selector );//匹配/^[^<]*(<[\w\W]+>)[^>]*$|^#([\w-]+)$/, match[1]即<[\w\W]+>) 为HTML 字符串 if ( match && (match[1] || !context) ) { if ( match[1] ) {//如果是HTML doc = (context ? context.ownerDocument || context : document); ret = rsingleTag.exec( selector );//匹配/^<(\w+)\s*\/?>(?:<\/\1>)?$/ if ( ret ) { if ( jQuery.isPlainObject( context ) ) {//jQuery(html, props):创建由 jQuery 对象包装的 DOM 元素。同时设置属性、事件等。 selector = [ document.createElement( ret[1] ) ];//使用document创建元素 jQuery.fn.attr.call( selector, context, true );//设置元素属性(props) } else { selector = [ doc.createElement( ret[1] ) ];//使用指定context创建元素 } } else {//? ret = buildFragment( [ match[1] ], [ doc ] ); selector = (ret.cacheable ? ret.fragment.cloneNode(true) : ret.fragment).childNodes; } }else{//#id elem = document.getElementById( match[2] );//根据id 查找元素 if ( elem ) { if ( elem.id !== match[2] ) {//如果element id 和查询不一致 return rootjQuery.find( selector );//rootjQuery = jQuery(document),这里相当于$(document).find(selector) } //包含当前元素 this.length = 1; this[0] = elem; } this.context = document; this.selector = selector; return this; } } else if ( !context && /^\w+$/.test( selector ) ) {//根据tagName 查找 this.selector = selector; this.context = document; selector = document.getElementsByTagName( selector ); } else if ( !context || context.jquery ) {//用于$(expr, $(...)),即context 为jQuery对象 return (context || rootjQuery).find( selector ); } else {//jQuery(expression, [context]):这个函数接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素。 return jQuery( context ).find( selector ); } } else if ( jQuery.isFunction( selector ) ) { return rootjQuery.ready( selector );// jQuery(callback),$(callback):$(document).ready()的简写 } if (selector.selector !== undefined) {// ? this.selector = selector.selector; this.context = selector.context; } return jQuery.isArray( selector ) ?// ? this.setArray( selector ) : jQuery.makeArray( selector, this ); } } window.jQuery = window.$ = jQuery;// 这里声明window.jQuery ,window.$为jQuery的简写 })(window);// 这里类似于一个初始化方法的声明,页面加载后执行
1 楼
albinhdk
2010-07-09
楼主的无私奉献值得赞扬。
学习楼主的专研精神!
学习楼主的专研精神!
2 楼
yolio2003
2010-07-09
下了 慢慢看 感谢分享
3 楼
fengjidao
2010-07-09
不错,赞一个
4 楼
tou3921
2010-07-10
js基础不够,跟lz学学
5 楼
foohsinglong
2010-07-10
JQuery本来就是JS框架......核心也就是把JS简化而已...
6 楼
forgood
2010-07-11
使用比较容易,但是想搞懂源码还是需要下功夫的。
7 楼
forgood
2010-07-11
谢谢ls的分享,我正在学习jquery。。。。。。
8 楼
jsj_064
2010-07-12
看源码还是很有难度的,顶楼主
9 楼
caowei3047
2010-07-12
不错的资料
10 楼
congdepeng
2010-07-12
js提供了mechanism 而jQuery提供了policy
11 楼
monsterjiao
2010-07-12
感谢分享。
12 楼
rmn190
2010-07-12
8错, 赞一下!
13 楼
yining159
2010-07-12
=。=竟然连谢都不可以。。。 收藏下 楼主辛苦
14 楼
yangzelin_job09
2010-07-13
楼主分析的还是很详细的,非常适合不想自己分析代码的人。
15 楼
MrPengPeng
2010-07-13
楼主 太刻苦了 !注释 都写的 很详细 !谢谢了!!下载看看 !分享 一下
16 楼
一醉而过
2010-07-14
看源码有点难度! 好好学习JS,不过高手都去看源码了~
17 楼
fxsc
2010-08-09
62. 应该是传入的如果是jquery对象,则把this指向传入的对象
66. 应该是传入一组dom对象
66. 应该是传入一组dom对象