jQuery内核解读-jQuery选择器

接着《 jQuery内核解读-原型继承》，下面来看看怎么实现为jQuery函数传递一个参数，并让它返回一个jQuery对象。 读一读jQuery源码会发现jQuery()函数包含两个参数selector和context，其中selector表示选择器，而content表示选择器内容范围，它表示一个DOM元素。先来做个简单的实验，只限定在获取标签选择器：

view plain 复制代码 print ?

1. <SPAN></SPAN>  
2. <SPAN></SPAN>  
3. <SPAN></SPAN>  
4. <SPAN></SPAN>  

view plain 复制代码 print ?

1. var $=jQuery=function(selector,context){   
2.     return new jQuery.fn.init(selector,context);//定义选择器的实例   
3. }   
4. jQuery.fn=jQuery.prototype={//jQuery类的原型对象   
5.     init:function(selector,context){//定义选择器构造器   
6.         selector = selector || document;//设置默认值为document   
7.         context = context || document;//设置默认值为document   
8.         if( selector.nodeType ){ //如果选择符为节点对象   
9.             this[0] = selector;//把参数节点传递给实例对象的数组   
10.             this.length = 1;//并设置实例对象的length属性，定义包含的元素个数   
11.             this.context = selector;//设置实例的属性，返回选择范围   
12.             return this;//返回当前实例   
13.         }   
14.         if( typeof selector==='string'){   
15.             var e = context.getElementsByTagName(selector); //获取指定名称的元素   
16.             for(var i =0;i<e.length;i++){//遍历元素集合，并把所有元素填入当前实例数组中   
17.                 this[i] = e[i];   
18.             }   
19.             this.length = e.length;//设置实例的length属性，即定义包含的元素个数   
20.             this.context = selector;//设置实例的属性，返回选择范围   
21.             return this;//返回当前实例   
22.         }   
23.         else{   
24.             this.length = 0;//否则设置实例的length属性值为0   
25.             this.context = selector;//设置实例的属性，返回选择范围   
26.             return this;//返回当前实例   
27.         }   
28.     },   
29.     jQuery:"1.3.2",   
30.     size:function(){   
31.         return this.length;   
32.     }   
33. };   
34. jQuery.fn.init.prototype=jQuery.fn;   
35.   
36. alert($('span').size());//返回4  

var $=jQuery=function(selector,context){
	return new jQuery.fn.init(selector,context);//定义选择器的实例
}
jQuery.fn=jQuery.prototype={//jQuery类的原型对象
	init:function(selector,context){//定义选择器构造器
		selector = selector || document;//设置默认值为document
		context = context || document;//设置默认值为document
		if( selector.nodeType ){ //如果选择符为节点对象
			this[0] = selector;//把参数节点传递给实例对象的数组
			this.length = 1;//并设置实例对象的length属性，定义包含的元素个数
			this.context = selector;//设置实例的属性，返回选择范围
			return this;//返回当前实例
		}
		if( typeof selector==='string'){
			var e = context.getElementsByTagName(selector); //获取指定名称的元素
			for(var i =0;i<e.length;i++){//遍历元素集合，并把所有元素填入当前实例数组中
				this[i] = e[i];
			}
			this.length = e.length;//设置实例的length属性，即定义包含的元素个数
			this.context = selector;//设置实例的属性，返回选择范围
			return this;//返回当前实例
		}
		else{
			this.length = 0;//否则设置实例的length属性值为0
			this.context = selector;//设置实例的属性，返回选择范围
			return this;//返回当前实例
		}
	},
	jQuery:"1.3.2",
	size:function(){
		return this.length;
	}
};
jQuery.fn.init.prototype=jQuery.fn;

alert($('span').size());//返回4

原文地址： http://www.kisscss.cn/thread-158-1-1.html

转载于:https://www.cnblogs.com/KissCss/archive/2011/03/24/1993453.html