jQuery源码分析之sizzle选择器详解

jQuery.fn.find = function (selector) { var i, ret, len = this.length, self = this; // 这段话真不知道是个什么的 if (typeof selector !== "string") { // fn.pushStack 和 jquery.merge 很像，但是返回一个 jquery 对象，且 // jquery 有个 prevObject 属性指向自己 return this.pushStack(jQuery(selector).filter(function () {  for (i = 0; i < len; i++) {  // jQuery.contains(a, b) 判断 a 是否是 b 的父代  if (jQuery.contains(self[i], this)) {   return true;  }  } })); } ret = this.pushStack([]); for (i = 0; i < len; i++) { // 在这里引用到 jQuery.find 函数 jQuery.find(selector, self[i], ret); } // uniqueSort 去重函数 return len > 1 ? jQuery.uniqueSort(ret) : ret;}

var rquickExpr = /^(?:#([/w-]+)|(/w+)|/.([/w-]+))$/;rquickExpr.exec('#id') //["#id", "id", undefined, undefined]rquickExpr.exec('div') //["div", undefined, "div", undefined]rquickExpr.exec('.test') //[".test", undefined, undefined, "test"]rquickExpr.exec('div p')// null

jQuery.find = Sizzle;function Sizzle(selector, context, results, seed) { var m, i, elem, nid, match, groups, newSelector, newContext = context && context.ownerDocument, // nodeType defaults to 9, since context defaults to document nodeType = context ? context.nodeType : 9; results = results || []; // Return early from calls with invalid selector or context if (typeof selector !== "string" || !selector || nodeType !== 1 && nodeType !== 9 && nodeType !== 11) { return results; } // Try to shortcut find operations (as opposed to filters) in HTML documents if (!seed) { if ((context ? context.ownerDocument || context : preferredDoc) !== document) {  // setDocument 函数其实是用来将 context 设置成 document，考虑到浏览器的兼容性  setDocument(context); } context = context || document; // true if (documentIsHTML) {  // match 就是那个有规律的数组  if (nodeType !== 11 && (match = rquickExpr.exec(selector))) {  // selector 是 id 的情况  if ((m = match[1])) {   // Document context   if (nodeType === 9) {   if ((elem = context.getElementById(m))) {    if (elem.id === m) {     results.push(elem);     return results;    }   } else {    return results;   }   // 非 document 的情况   } else {   if (newContext && (elem = newContext.getElementById(m)) && contains(context, elem) && elem.id === m) {    results.push(elem);    return results;   }   }  // selector 是 tagName 情况  } else if (match[2]) {   // 这里的 push：var push = arr.push   push.apply(results, context.getElementsByTagName(selector));   return results;  // selector 是 class 情况  } else if ((m = match[3]) && support.getElementsByClassName && context.getElementsByClassName) {   push.apply(results, context.getElementsByClassName(m));   return results;  }  }  // 如果浏览器支持 querySelectorAll  if (support.qsa && !compilerCache[selector + " "] && (!rbuggyQSA || !rbuggyQSA.test(selector))) {  if (nodeType !== 1) {   newContext = context;   newSelector = selector;   // qSA looks outside Element context, which is not what we want   // Support: IE <=8,还是要考虑兼容性  } else if (context.nodeName.toLowerCase() !== "object") {   // Capture the context ID, setting it first if necessary   if ((nid = context.getAttribute("id"))) {   nid = nid.replace(rcssescape, fcssescape);   } else {   context.setAttribute("id", (nid = expando));   }   // Sizzle 词法分析的部分   groups = tokenize(selector);   i = groups.length;   while (i--) {   groups[i] = "#" + nid + " " + toSelector(groups[i]);   }   newSelector = groups.join(",");   // Expand context for sibling selectors   newContext = rsibling.test(selector) && testContext(context.parentNode) || context;  }  if (newSelector) {   try {   push.apply(results, newContext.querySelectorAll(newSelector));   return results;   } catch(qsaError) {} finally {   if (nid === expando) {    context.removeAttribute("id");   }   }  }  } } } // All others，select 函数和 tokenize 函数后文再谈 return select(selector.replace(rtrim, "$1"), context, results, seed);}

jQuery.fn.pushStack = function (elems) { // Build a new jQuery matched element set var ret = jQuery.merge(this.constructor(), elems); // Add the old object onto the stack (as a reference) ret.prevObject = this; // Return the newly-formed element set return ret;}

jQuery.contains = function (context, elem) { // 考虑到兼容性，设置 context 的值 if ((context.ownerDocument || context) !== document) { setDocument(context); } return contains(context, elem);}// contains 是内部函数，判断 DOM_a 是否是 DOM_b 的var contains = function (a, b) { var adown = a.nodeType === 9 ? a.documentElement : a, bup = b && b.parentNode; return a === bup || !!(bup && bup.nodeType === 1 && ( adown.contains ? adown.contains(bup) : a.compareDocumentPosition && a.compareDocumentPosition(bup) & 16));}

jQuery.uniqueSort = function (results) { var elem, duplicates = [], j = 0, i = 0; // hasDuplicate 是一个判断是否有相同元素的 flag，全局 hasDuplicate = !support.detectDuplicates; sortInput = !support.sortStable && results.slice(0); results.sort(sortOrder); if (hasDuplicate) { while ((elem = results[i++])) {  if (elem === results[i]) {   j = duplicates.push(i);  } } while (j--) {  // splice 用于将重复的元素删除  results.splice(duplicates[j], 1); } } // Clear input after sorting to release objects // See https://github.com/jquery/sizzle/pull/225 sortInput = null; return results;}

var sortOrder = function (a, b) { // 表示有相同的元素，设置 flag 为 true if (a === b) { hasDuplicate = true; return 0; } // Sort on method existence if only one input has compareDocumentPosition var compare = !a.compareDocumentPosition - !b.compareDocumentPosition; if (compare) { return compare; } // Calculate position if both inputs belong to the same document compare = (a.ownerDocument || a) === (b.ownerDocument || b) ? a.compareDocumentPosition(b) : // Otherwise we know they are disconnected 1; // Disconnected nodes if (compare & 1 || (!support.sortDetached && b.compareDocumentPosition(a) === compare)) { // Choose the first element that is related to our preferred document if (a === document || a.ownerDocument === preferredDoc && contains(preferredDoc, a)) {  return -1; } if (b === document || b.ownerDocument === preferredDoc && contains(preferredDoc, b)) {  return 1; } // Maintain original order return sortInput ? (indexOf(sortInput, a) - indexOf(sortInput, b)) : 0; } return compare & 4 ? -1 : 1;}