Sizzle 源码分析 （二）
在Sizzle函数中，如果能快速处理或者通过querySelector处理，那么就使用它处理。否则使用select函数处理 。
select函数
select = Sizzle.select = function (selector, context, results, seed) {
var i, tokens, token, type, find,
// 判定是否是 pre-compiled 的选择器
compiled = typeof selector === "function" && selector,
// 这里由于compiled 是false ，所以先认为selector 是字符串，进入tokenize函数 ，进入词法分析 。
// 将 selector 分为组并返回
match = !seed && tokenize((selector = compiled.selector || selector));
};
所以，这一节的主要内容是 tokenize 函数
tokenize 函数
tokenize = Sizzle.tokenize = function (selector, parseOnly) {
var matched, match, tokens, type,
soFar, groups, preFilters,
// 先查看是否有缓存
cached = tokenCache[selector + " "];
if (cached) {
// 如果有缓存，就先从缓冲中取 。
return parseOnly ? 0 : cached.slice(0);
}
soFar = selector; // 下面对选择器从左至右进行分析
groups = []; // 用 ， 分割的组合选择器，每个选择器都是一个组 。
preFilters = Expr.preFilter; // 过滤器
while (soFar) {
// 第一个运行matched 为undefined，一定为假 。
// 105行，找出逗号 rcomma = new RegExp("^" + whitespace + "*," + whitespace + "*"),
// 逗号用来分组，所以下面if 的逻辑主要是添加组 ，即group 。
if (!matched || (match = rcomma.exec(soFar))) {
if (match) {
soFar = soFar.slice(match[0].length) || soFar;
}
// 将一个数组push到组中 。
groups.push((tokens = []));
}
matched = false;
// 106 行 rcombinators = new RegExp("^" + whitespace + "*([>+~]|" + whitespace + ")" + whitespace + "*"),
// 这个正则表达式就是为了找出 关系符 ">+~ " 。
// 在上面添加了组，把逗号已经去掉，下面就是逗号之后的标识符 ，首先 match = rcombinators.exec(soFar)) 判定关系符号，但是第一次从组跳下，这里肯定为false 。所以又跳转到之后的if 。
if ((match = rcombinators.exec(soFar))) {
matched = match.shift();
tokens.push({
value: matched,
// Cast descendant combinators to space
type: match[0].replace(rtrim, " ")
});
soFar = soFar.slice(matched.length);
}
// 这里主要判定表示符是 id ，class 还是 tag 。
// identifier = "(?:\\\\.|[\\w-]|[^\\x00-\\xa0])+", 这里的 \\\\. 表示 在css中，可以有转义字符作为标识符 。比如 \$,\&
// 捕捉属性选择器，这个正则是最难的，不一定完全理解。
// attributes = "\\[" + whitespace + "*(" + identifier + ")(?:" + whitespace +
//"*([*^$|!~]?=)" + whitespace +
//"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|(" + identifier + "))|)" + whitespace +
//"*\\]",
// booleans = "checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",
// 处理各种伪类 。
// pseudos = ":(" + identifier + ")(?:\\((" +
//"('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|" +
//"((?:\\\\.|[^\\\\()[\\]]|" + attributes + ")*)|" +
//".*" +
//")\\)|)",
// matchExpr = {
// "ID": new RegExp("^#(" + identifier + ")"),
// "CLASS": new RegExp("^\\.(" + identifier + ")"),
// "TAG": new RegExp("^(" + identifier + "|[*])"),
// "ATTR": new RegExp("^" + attributes),
// "PSEUDO": new RegExp("^" + pseudos),
// "CHILD": new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\(" + whitespace +
// "*(even|odd|(([+-]|)(\\d*)n|)" + whitespace + "*(?:([+-]|)" + whitespace +
// "*(\\d+)|))" + whitespace + "*\\)|)", "i"),
// "bool": new RegExp("^(?:" + booleans + ")$", "i"),
// "needsContext": new RegExp("^" + whitespace + "*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\(" +
// whitespace + "*((?:-\\d)?\\d*)" + whitespace + "*\\)|)(?=[^-]|$)", "i")
// },
for (type in Expr.filter) {
// 如果是上面的一种 、
// preFilters是用于分析选择器的名字与参数
// 预处理，有的选择器，比如属性选择器与伪类从选择器组分割出来，还要再细分
// 属性选择器要切成属性名，属性值，操作符；伪类要切为类型与传参；
// 子元素过滤伪类还要根据an+b的形式再划分
if ((match = matchExpr[type].exec(soFar)) && (!preFilters[type] ||
(match = preFilters[type](match)))) {
matched = match.shift();
tokens.push({
value: matched,
type: type,
matches: match
});
soFar = soFar.slice(matched.length);
}
}
if (!matched) {
break;
}
}
// 正常情况下，soFar全部解析完毕，此时为空字符串 。如果仅仅如parse，那么返回剩下长度，否则，抛出异常 。
return parseOnly ?
soFar.length :
soFar ?
Sizzle.error(selector) :
// 缓存起来 。
tokenCache(selector, groups).slice(0);
};
filter 部分
// 这是filter，返回match的柯里化函数 。在编译部分会使用，这里不会用到 。
filter: {
// 标签过滤器 ，返回一个柯里化函数 。
// 验证元素的名称是否就是当前传入的Tag 。Tag放入闭包中 。
"TAG": function (nodeNameSelector) {
var nodeName = nodeNameSelector.replace(runescape, funescape).toLowerCase();
return nodeNameSelector === "*" ?
function () { return true; } :
function (elem) {
return elem.nodeName && elem.nodeName.toLowerCase() === nodeName;
};
},
// 类过滤器 ，返回一个柯里化函数 。
// 验证元素的类名称是否包含当前传入的className 。
"CLASS": function (className) {
var pattern = classCache[className + " "];
return pattern ||
(pattern = new RegExp("(^|" + whitespace + ")" + className + "(" + whitespace + "|$)")) &&
classCache(className, function (elem) {
return pattern.test(typeof elem.className === "string" && elem.className || typeof elem.getAttribute !== "undefined" && elem.getAttribute("class") || "");
});
},
"ATTR": function (name, operator, check) {
// 返回的是函数 ！
return function (elem) {
var result = Sizzle.attr(elem, name);
// 如果属性值为空
if (result == null) {
return operator === "!=";
}
// 如果操作符为空，
if (!operator) {
return true;
}
// 将属性值转化为字符串。
result += "";
return operator === "=" ? result === check :
operator === "!=" ? result !== check :
operator === "^=" ? check && result.indexOf(check) === 0 :
operator === "*=" ? check && result.indexOf(check) > -1 :
operator === "$=" ? check && result.slice(-check.length) === check :
operator === "~=" ? (" " + result.replace(rwhitespace, " ") + " ").indexOf(check) > -1 :
operator === "|=" ? result === check || result.slice(0, check.length + 1) === check + "-" :
false;
};
},
// 这里处理子元素过滤伪类,如:nth-child, :first-child, :only-child
"CHILD": function (type, what, argument, first, last) {
var simple = type.slice(0, 3) !== "nth",
forward = type.slice(-4) !== "last",
ofType = what === "of-type";
return first === 1 && last === 0 ?
// Shortcut for :nth-*(n)
function (elem) {
return !!elem.parentNode;
} :
function (elem, context, xml) {
var cache, outerCache, node, diff, nodeIndex, start,
dir = simple !== forward ? "nextSibling" : "previousSibling",
parent = elem.parentNode,
name = ofType && elem.nodeName.toLowerCase(),
useCache = !xml && !ofType;
if (parent) {
// :(first|last|only)-(child|of-type)
if (simple) {
while (dir) {
node = elem;
while ((node = node[dir])) {
if (ofType ? node.nodeName.toLowerCase() === name : node.nodeType === 1) {
return false;
}
}
// Reverse direction for :only-* (if we haven't yet done so)
start = dir = type === "only" && !start && "nextSibling";
}
return true;
}
start = [forward ? parent.firstChild : parent.lastChild];
// non-xml :nth-child(...) stores cache data on `parent`
if (forward && useCache) {
// Seek `elem` from a previously-cached index
outerCache = parent[expando] || (parent[expando] = {});
cache = outerCache[type] || [];
nodeIndex = cache[0] === dirruns && cache[1];
diff = cache[0] === dirruns && cache[2];
node = nodeIndex && parent.childNodes[nodeIndex];
while ((node = ++nodeIndex && node && node[dir] ||
// Fallback to seeking `elem` from the start
(diff = nodeIndex = 0) || start.pop())) {
// When found, cache indexes on `parent` and break
if (node.nodeType === 1 && ++diff && node === elem) {
outerCache[type] = [dirruns, nodeIndex, diff];
break;
}
}
// Use previously-cached element index if available
} else if (useCache && (cache = (elem[expando] || (elem[expando] = {}))[type]) && cache[0] === dirruns) {
diff = cache[1];
// xml :nth-child(...) or :nth-last-child(...) or :nth(-last)?-of-type(...)
} else {
// Use the same loop as above to seek `elem` from the start
while ((node = ++nodeIndex && node && node[dir] ||
(diff = nodeIndex = 0) || start.pop())) {
if ((ofType ? node.nodeName.toLowerCase() === name : node.nodeType === 1) && ++diff) {
// Cache the index of each encountered element
if (useCache) {
(node[expando] || (node[expando] = {}))[type] = [dirruns, diff];
}
if (node === elem) {
break;
}
}
}
}
// Incorporate the offset, then check against cycle size
diff -= last;
return diff === first || (diff % first === 0 && diff / first >= 0);
}
};
},
"PSEUDO": function (pseudo, argument) {
// pseudo-class names are case-insensitive
// http://www.w3.org/TR/selectors/#pseudo-classes
// Prioritize by case sensitivity in case custom pseudos are added with uppercase letters
// Remember that setFilters inherits from pseudos
var args,
fn = Expr.pseudos[pseudo] || Expr.setFilters[pseudo.toLowerCase()] ||
Sizzle.error("unsupported pseudo: " + pseudo);
// The user may use createPseudo to indicate that
// arguments are needed to create the filter function
// just as Sizzle does
if (fn[expando]) {
return fn(argument);
}
// But maintain support for old signatures
if (fn.length > 1) {
args = [pseudo, pseudo, "", argument];
return Expr.setFilters.hasOwnProperty(pseudo.toLowerCase()) ?
markFunction(function (seed, matches) {
var idx,
matched = fn(seed, argument),
i = matched.length;
while (i--) {
idx = indexOf(seed, matched[i]);
seed[idx] = !(matches[idx] = matched[i]);
}
}) :
function (elem) {
return fn(elem, 0, args);
};
}
return fn;
}
},
priFilter
preFilter: {
"ATTR": function (match) {
match[1] = match[1].replace(runescape, funescape);
// Move the given value to match[3] whether quoted or unquoted
match[3] = (match[3] || match[4] || match[5] || "").replace(runescape, funescape);
if (match[2] === "~=") {
match[3] = " " + match[3] + " ";
}
return match.slice(0, 4);
},
"CHILD": function (match) {
/* matches from matchExpr["CHILD"]
1 type (only|nth|...)
2 what (child|of-type)
3 argument (even|odd|\d*|\d*n([+-]\d+)?|...)
4 xn-component of xn+y argument ([+-]?\d*n|)
5 sign of xn-component
6 x of xn-component
7 sign of y-component
8 y of y-component
*/
//将它的伪类名称与传参拆分为更细的单元,以数组形式返回
//比如 ":nth-child(even)"变为
//["nth","child","even", 2, 0, undefined, undefined, undefined]
match[1] = match[1].toLowerCase();
if (match[1].slice(0, 3) === "nth") {
// nth-* requires argument
if (!match[3]) {
Sizzle.error(match[0]);
}
// numeric x and y parameters for Expr.filter.CHILD
// remember that false/true cast respectively to 0/1
match[4] = +(match[4] ? match[5] + (match[6] || 1) : 2 * (match[3] === "even" || match[3] === "odd"));
match[5] = +((match[7] + match[8]) || match[3] === "odd");
// other types prohibit arguments
} else if (match[3]) {
Sizzle.error(match[0]);
}
return match;
},
"PSEUDO": function (match) {
//将它的伪类名称与传参进行再处理
//比如:contains伪类会去掉两边的引号,反义伪类括号部分会再次提取
var excess,
unquoted = !match[6] && match[2];
if (matchExpr["CHILD"].test(match[0])) {
return null;
}
// Accept quoted arguments as-is
if (match[3]) {
match[2] = match[4] || match[5] || "";
// Strip excess characters from unquoted arguments
} else if (unquoted && rpseudo.test(unquoted) &&
// Get excess from tokenize (recursively)
(excess = tokenize(unquoted, true)) &&
// advance to the next closing parenthesis
(excess = unquoted.indexOf(")", unquoted.length - excess) - unquoted.length)) {
// excess is a negative index
match[0] = match[0].slice(0, excess);
match[2] = unquoted.slice(0, excess);
}
// Return only captures needed by the pseudo filter method (type and argument)
return match.slice(0, 3);
}
},
