這篇文章主要介紹了jQuery選擇器源碼解讀(四)：tokenize方法的Expr.preFilter,本文用詳細(xì)的注釋解讀了tokenize方法的Expr.preFilter的實現(xiàn)源碼,需要的朋友可以參考下

Expr.preFilter是tokenize方法中對ATTR、CHILD、PSEUDO三種選擇器進行預(yù)處理的方法。具體如下：

1. Expr.preFilter : { 
2. "ATTR" : function(match) { 
3. /* 
4. * 完成如下任務(wù)： 
5. * 1、屬性名稱解碼 
6. * 2、屬性值解碼 
7. * 3、若判斷符為~=，則在屬性值兩邊加上空格 
8. * 4、返回最終的mtach對象 
9. *  
10. * match[1]表示屬性名稱， 
11. * match[1].replace(runescape, funescape)：將屬性名稱中的十六進制數(shù)解碼成 
12. * 單字節(jié)unicode字符或雙字節(jié)unicode字符（中文或其它需要兩個字節(jié)表達(dá)的文字） 
13. * 正則表達(dá)式的詳細(xì)說明，可以參看我的“詳解jQuery選擇器正則表達(dá)式”文章 
14. */ 
15. match[1] = match[1].replace(runescape, funescape); 
16.  
17. /* 
18. * 將屬性值解碼 
19. * match[4]：表示放在單引號或雙引號內(nèi)的屬性值 
20. * match[5]: 表示不用引號括起來的屬性值 
21. */ 
22. match[3] = (match[4] || match[5] || "").replace(runescape, 
23. funescape); 
24.  
25. /* 
26. * ~=的意思是單詞匹配，在W3C中對單詞的定義是以空白為不同單詞的分隔符 
27. * 故此處在match[3]兩邊加上空格后，可以利用indexOf，正確識別出該單詞是否存在 
28. */ 
29. if (match[2] === "~=") { 
30. match[3] = " " + match[3] + " "; 
31. } 
32.  
33. /* 
34. * 返回有用的前四個元素結(jié)果 
35. */ 
36. return match.slice(0, 4); 
37. }, 
38.  
39. "CHILD" : function(match) { 
40. /* 
41. * 完成如下幾項任務(wù)： 
42. * 1、把命令中child和of-type之前的字符變成小寫字符 
43. * 2、對于nth開頭的選擇器檢查括號內(nèi)的數(shù)據(jù)有效性 
44. * 3、match[4]和match[5]分別存放xn+b中的x和b，x和b允許是負(fù)數(shù) 
45. * 4、返回最終的match對象 
46. *  
47. * match[1]：(only|first|last|nth|nth-last)中的一個 
48. */ 
49. match[1] = match[1].toLowerCase(); 
50.  
51. /* 
52. * 對于nth-child、nth-of-type、nth-last-child、nth-last-of-type四種類型括號內(nèi)需設(shè)置有效數(shù)據(jù) 
53. * 而其它則括號內(nèi)不允許有任何數(shù)據(jù) 
54. */ 
55. if (match[1].slice(0, 3) === "nth") { 
56. /* 
57. * 若選擇器括號內(nèi)沒有有效參數(shù)，則拋出異常 
58. * 舉例：若選擇器是nth或nth(abc)則屬于非法選擇器 
59. */ 
60. if (!match[3]) { 
61. Sizzle.error(match[0]); 
62. } 
63. /* 
64. * 下面先以nth-child()為例介紹一下語法，以便更好的理解下面代碼的作用 
65. * nth-child允許的幾種使用方式如下： 
66. * :nth-child(even) 
67. * :nth-child(odd) 
68. * :nth-child(3n) 
69. * :nth-child(+2n+1) 
70. * :nth-child(2n-1) 
71. * 下面代碼中賦值號左側(cè)的match[4]、match[5]用于分別記錄括號內(nèi)n前及n后的數(shù)值，包括正負(fù)號 
72. * 對于:nth-child(even)和:nth-child(odd)來說，match[4]為空， 
73. * 所以返回 2 * (match[3] === "even" || match[3] === "odd")的計算結(jié)果 
74. * 因為在js中true=1,false=0，所以(match[3] === "even" || match[3] === "odd")等于1 
75. * 因此，2 * (match[3] === "even" || match[3] === "odd")的計算結(jié)果為2 
76. *  
77. * 等號右側(cè)的“+”的作用是強制類型轉(zhuǎn)換，將之后的字符串轉(zhuǎn)換成數(shù)值類型  
78. */ 
79. match[4] = +(match[4] ? match[5] + (match[6] || 1) 
80. : 2 * (match[3] === "even" || match[3] === "odd")); 
81. match[5] = +((match[7] + match[8]) || match[3] === "odd"); 
82.  
83. } else if (match[3]) { 
84. /* 
85. * 若非nth起頭的其它CHILD類型選擇器帶有括號說明，則拋出異常 
86. * 這里jQuery并沒有嚴(yán)格按照W3C的規(guī)則來判定，因為其允許:first-child()的這種形式存在 
87. * 也就是對于jQuery來說:first-child()等同于:first-child，是合法選擇器 
88. */ 
89. Sizzle.error(match[0]); 
90. } 
91.  
92. return match; 
93. }, 
94.  
95. "PSEUDO" : function(match) { 
96. /* 
97. * 完成如下任務(wù)： 
98. * 1、獲取偽類中用引號括起來的值 
99. * 2、對于非引號括起來的值，若存在偽類嵌套，則進一步解析確定當(dāng)前偽類實際結(jié)束位置， 
100. * 獲取當(dāng)前偽類的完整字符串和值 
101. * 3、返回match中的前三項的副本。 
102. *  
103. * unquoted表示括號內(nèi)非引號括起來的值， 
104. * 以:eq(2)為例，unquoted=2 
105. */ 
106. var excess, unquoted = !match[5] && match[2]; 
107.  
108. /* 
109. * 因為pseudo與child的匹配正則表達(dá)式有交集，所以，需要把屬于child的部分忽略掉 
110. */ 
111. if (matchExpr["CHILD"].test(match[0])) { 
112. return null; 
113. } 
114. /* 
115. * 若括號內(nèi)的值使用引號(match[3])括起來的， 
116. * 則將除引號外的值(match[4])賦給match[2]。 
117. * match[3]表示引號。 
118. */ 
119. if (match[3] && match[4] !== undefined) { 
120. match[2] = match[4]; 
121. } else if (unquoted 
122. /* 
123. * rpseudo.test(unquoted)：用來測試unquoted是否包含偽類， 
124. * 若包含偽類，則說明有可能存在偽類嵌套的可能性，需要進一步對unquoted進行解析 
125. * 例如： :not(:eq(3)) 
126. */ 
127. && rpseudo.test(unquoted) 
128. && 
129. /* 
130. * 獲取unquoted中連續(xù)有效地選擇器最后一個字符所在位置 
131. */ 
132. (excess = tokenize(unquoted, true)) 
133. && 
134. /* 
135. * unquoted.indexOf(")", unquoted.length - excess) 
136. * 從之前獲得的連續(xù)有效地選擇器最后一個字符所在位置之后找到")"所在位置， 
137. * 通常就在當(dāng)前位置之后。 
138. * 再減去unquoted.length，用來獲得match[0]中的有效完整的偽類字符串最后位置， 
139. * 注意，此時excess是一個負(fù)值 
140. *  
141. */ 
142. (excess = unquoted.indexOf(")", unquoted.length 
143. - excess) 
144. - unquoted.length)) { 
145.  
146. // 獲取有效的完整偽類match[0]和偽類括號內(nèi)的數(shù)據(jù)match[2] 
147. match[0] = match[0].slice(0, excess); 
148. match[2] = unquoted.slice(0, excess); 
149. } 
150.  
151. // 返回match前三個元素的副本 
152. return match.slice(0, 3); 
153. } 
154. }