jQuery1.3.2 源码学习-4 init 函数分析 - 2

47 // Handle HTML strings

48 if ( typeof selector === "string" ) {

49 // Are we dealing with HTML string or an ID?

50 var match = quickExpr.exec( selector );

51

52 // Verify a match, and that no context was specified for #id

53 if ( match && (match[1] || !context) ) {

54

55 // HANDLE: $(html) -> $(array)

56 if ( match[1] )

57 selector = jQuery.clean( [ match[1] ], context );

58

59 // HANDLE: $("#id")

60 else {

61 var elem = document.getElementById( match[3] );

62

63 // Handle the case where IE and Opera return items

64 // by name instead of ID

65 if ( elem && elem.id != match[3] )

66 return jQuery().find( selector );

67

68 // Otherwise, we inject the element directly into the jQuery object

69 var ret = jQuery( elem || [] );

70 ret.context = document;

71 ret.selector = selector;

72 return ret;

73 }

74

75 // HANDLE: $(expr, [context])

76 // (which is just equivalent to: $(content).find(expr)

77 } else

78 return jQuery( context ).find( selector );

79

80 // HANDLE: $(function)

81 // Shortcut for document ready

82 } else if ( jQuery.isFunction( selector ) )

第 48 行通过 typeof 判断参数是否为一个字符串,字符串又有三种可能。

在第 50 行通过正则表达式来判断字符串是否为一个 ID 或者一个 HTML 的串。match 保存匹配的结果。

第 53 行判断是否为 HTML 串,通过判断是否满足正则表达式的第一个分组来判断,是通过 jQuery.clean 进行处理。返回结果保存在 selector 中。

否则的话,说明满足了第三个分组,字符串是一个 ID,从 61 行开始,进行 ID 的处理,首先使用标准的 document.getElementById 通过 ID 来获取对象的引用。但是,这个方法在 IE 和 Opera 下有一个问题,浏览器在没有找到指定 ID 的对象的时候,会再次寻找 name 属性为这个 ID 的对象,如果有的话,会返回 name 属性为 ID 的对象,这样就不一定是我们希望的结果了。在第 65 行进行判断,如果找到的对象不是我们期望的对象,那么重新使用 find 进行处理。

如果 ID 没有问题,那么将结果创建成一个 jQuery 对象,69 行说明如果没有找到对象就使用一个数组对象来表示。再次使用 jQuery() 函数,这次调用函数的参数就是一个对象的引用,如果找到了,那么这个参数就是找到的对象,如果没有找到,参数就使一个数组对象。

如果找到了,那么这个对象就一定有 nodeType 属性,在上边的分析中 (41-46行)可以看到,jQuery 函数将返回一个 jQuery 对象,这个对象属性为 0 的成员值就是找到的对象,还有一个 length 的成员为 1, 另外有一个 context 的成员同样指向这个找到的对象。

如果没有找到对象,那么传递一个数组对象,这个对象的 length 属性将为 0。

对于数组的处理将在下面看到。

第 69 行中 ret 将表示这个 jQeury 对象,然后,设置 context 属性为 当前的文档对象 document ,selector 为当前结果的选择器。最后在第 72 行返回这个对象。

第 77 行的 else 用来处理字符串的第三种可能,它对应 53 行的用来判断 selector 是否为 ID 或者 HTML 串的 if 语句,也就是说不是 HTML 串,也不是 ID的字符串,那么,只有一种可能,就是这是一个 CSS 的选择串。那么通过第 78 行进行处理,直接返回。

82 } else if ( jQuery.isFunction( selector ) )

83 return jQuery( document ).ready( selector );

第 82 和 83 行处理第三种可能:函数。

如果参数为一个函数,那么,首先通过 jQuery( document ) 获取一个表示 document 的 jQuery 对象,然后将函数设置这个对象的 ready 事件处理。

84

85 // Make sure that old selector state is passed along

86 if ( selector.selector && selector.context ) {

87 this.selector = selector.selector;

88 this.context = selector.context;

89 }

90

91 return this.setArray(jQuery.isArray( selector ) ?

92 selector :

93 jQuery.makeArray(selector));

94},

86 行的 selector 为第 57 行所获得的通过 HTML 串得到的对象。如果这个对象有 selector 属性和 context 属性,那么复制到当前的对象上来。

91 行判断这个 selector 对象是否为数组对象,如果是,将这个对象上的数组成员复制到当前对象上来,如果不是的话,首先通过 93 行的 makeArray 创建成数组对象。然后再复制到当前对象上来。