自制jQuery(3)
2021-07-07 21:05
标签:结果 prot his end 连接 div 一个 concat ++ 目前仅支持标签选择器,如“div", "div p"。而且$("div")返回的是Array对象,和实际的jQuery不同 自制jQuery(3) 标签:结果 prot his end 连接 div 一个 concat ++ 原文地址:http://www.cnblogs.com/WebNewer/p/7099031.html 1 (function( window, undefined ) {
2 var jQuery = (function(){
3 var jQuery = function(selector){
4 return new jQuery.fn.init(selector);
5 };
6
7 //这里fn是prototype的别名,后面的代码扩展fn就是扩展prototype,fn写起来简短
8 //如果后面引用了大量的prototype,prototype因为是关键字,还不能被压缩
9 jQuery.fn = jQuery.prototype = {
10 constructor: jQuery,
11 //这是一个构造函数
12 init: function(selector, context){
13 var root;
14 //如果没有root,就从document开始查找
15 root = context || document;
16 //
17 var parts = selector.split(" "), //以空格分离选择器
18 query = parts[0], //取出第一段结果
19 //slice返回从第1项到最后一项组成的一个新数组
20 //join把数组中的每个元素转换为字符串,并且用空格连接起来,形成一个String对象
21 rest = parts.slice(1).join(" "),
22 elems = root.getElementsByTagName(query), //查找匹配第一段选择器的元素
23 results = []; //初始化一个数组,用于保存查询结果
24
25 for(var i = 0; i ){
26 if(rest){
27 //递归查找,以elems[i]为上下文,以rest为选择器表达式
28 //concat会创建一个原数组的副本,并将find的结果添加到results末尾,,这里又将这个副本的引用存回results
29 results = results.concat(find(rest, elems[i]));
30 }
31 else{
32 //将查找到的元素保存在results数组上
33 results.push(elems[i]);
34 }
35 }
36 //真正的jQuery返回的是不是Array对象,是一个类数组对象
37 return results;//返回Array对象
38
39 }
40 };
41 jQuery.fn.init.prototype = jQuery.fn;
42 jQuery.extend = jQuery.fn.extend = function(){
43 var ob = arguments[0];
44 for(var p in ob){
45 if(ob.hasOwnProperty(p) && (!this.hasOwnProperty(p))){
46 this[p]=ob[p];
47 }
48 }
49 };
50
51 //用于扩展全局对象,所以不用jQuery.fn.extend
52 jQuery.extend({
53 isFunction: function () {
54 if(typeof arguments[0] == "function")
55 return true;
56 else
57 return false;
58 }
59 });
60
61 jQuery.extend({
62 isFrom:function(){
63 return argument[0].constructor == arguments[1];
64 //return arguments[0] instanceof arguments[1];
65 }});
66
67
68 jQuery.extend({
69 each:function(obj,callback){
70 for(var i = 0; i ){
71 callback.call(obj || null, obj[i], i, obj);
72 }
73 }
74 });
75 /*
76 对于HTML文档,getElementsByTagName返回的是一个HTMLCollection对象,该对象和NodeLIst对象很类似,该函数是用C++实现的
77 详见《JS高程》P257
78 return jQuery.makeArray(document.getElementsByTagName(selector));
79 */
80 jQuery.extend({
81 makeArray:function( array, results ){
82 //array是HTMLCollection对像
83 array = Array.prototype.slice.call( array, 0 );
84 if ( results ) {
85 results.push.apply( results, array );
86 return results;
87 }
88
89 return array;
90 }
91 });
92 return jQuery;
93 })();
94 window.jQuery = window.$ = jQuery;
95 })(window);