jquery Selector 源码分析

/**

* author:prk

* date:2008-08-04

* comment:comment for selector of jQuery

*

*/

var chars = jQuery.browser.safari && parseInt(jQuery.browser.version) < 417

? "(?:[\\w*_-]|\\\\.)"

: "(?:[\\w\u0128-\uFFFF*_-]|\\\\.)", quickChild = new RegExp("^>\\s*("

+ chars + "+)"), quickID = new RegExp("^(" + chars + "+)(#)(" + chars

+ "+)"), // ^((?:[\\w*_-]|\\\\.))(#)((?:[\\w*_-]|\\\\.))

quickClass = new RegExp("^([#.]?)(" + chars + "*)");// ^([#.]?)((?:[\\w*_-]|\\\\.)*)

jQuery.extend( {

expr : {

"" : function(a, i, m) {

return m[2] == "*" || jQuery.nodeName(a, m[2]);

},

"#" : function(a, i, m) {

return a.getAttribute("id") == m[2];

},

":" : {

// Position Checks

lt : function(a, i, m) {

return i < m[3] - 0;

},

gt : function(a, i, m) {

return i > m[3] - 0;

},

nth : function(a, i, m) {

return m[3] - 0 == i;

},

eq : function(a, i, m) {

return m[3] - 0 == i;

},

first : function(a, i) {

return i == 0;

},

last : function(a, i, m, r) {

return i == r.length - 1;

},

even : function(a, i) {

return i % 2 == 0;

},

odd : function(a, i) {

return i % 2;

},

// Child Checks

"first-child" : function(a) {

return a.parentNode.getElementsByTagName("*")[0] == a;

},

"last-child" : function(a) {

return jQuery.nth(a.parentNode.lastChild, 1, "previousSibling") == a;

},

"only-child" : function(a) {

return !jQuery.nth(a.parentNode.lastChild, 2, "previousSibling");

},

// Parent Checks

parent : function(a) {

return a.firstChild;

},

empty : function(a) {

return !a.firstChild;

},

// Text Check

contains : function(a, i, m) {

return (a.textContent || a.innerText || jQuery(a).text() || "")

.indexOf(m[3]) >= 0;

},

// Visibility

visible : function(a) {

return "hidden" != a.type && jQuery.css(a, "display") != "none"

&& jQuery.css(a, "visibility") != "hidden";

},

hidden : function(a) {

return "hidden" == a.type || jQuery.css(a, "display") == "none"

|| jQuery.css(a, "visibility") == "hidden";

},

// Form attributes

enabled : function(a) {

return !a.disabled;

},

disabled : function(a) {

return a.disabled;

},

checked : function(a) {

return a.checked;

},

selected : function(a) {

return a.selected || jQuery.attr(a, "selected");

},

// Form elements

text : function(a) {

return "text" == a.type;

},

radio : function(a) {

return "radio" == a.type;

},

checkbox : function(a) {

return "checkbox" == a.type;

},

file : function(a) {

return "file" == a.type;

},

password : function(a) {

return "password" == a.type;

},

submit : function(a) {

return "submit" == a.type;

},

image : function(a) {

return "image" == a.type;

},

reset : function(a) {

return "reset" == a.type;

},

button : function(a) {

return "button" == a.type || jQuery.nodeName(a, "button");

},

input : function(a) {

return /input|select|textarea|button/i.test(a.nodeName);

},

// :has()

has : function(a, i, m) {

return jQuery.find(m[3], a).length;

},

// :header

header : function(a) {

return /h\d/i.test(a.nodeName);

},

// :animated

animated : function(a) {

return jQuery.grep(jQuery.timers, function(fn) {

return a == fn.elem;

}).length;

}

}

},

// The regular expressions that power the parsing engine

parse : [

// Match: [@value='test'], [@foo]

/^(\[) *@?([\w:-]+) *([!*$^~=]*) *('?"?)(.*?)\4 *\]/,

// Match: :contains('foo')

/^(:)([\w-]+)\("?'?(.*?(\(.*?\))?[^(]*?)"?'?\)/,

// Match: :even, :last-child, #id, .class

new RegExp("^([:.#]*)(" + chars + "+)")],

multiFilter : function(expr, elems, not) {

var old, cur = [];

while (expr && expr != old) {// 存在且改变

old = expr;

var f = jQuery.filter(expr, elems, not);

expr = f.t.replace(/^\s*,\s*/, "");

cur = not ? elems = f.r : jQuery.merge(cur, f.r);

}

return cur;

},

find : function(t, context) {

if (typeof t != "string")

return [t];// 快速处理非字符表达式

if (context && context.nodeType != 1 && context.nodeType != 9)

return [];// 确保context是DOM元素或document

context = context || document;// 缺省的context

// 初始化，ret:result, done:已经完成，last:上一次的t,nodeName:节点名，如p

var ret = [context], done = [], last, nodeName;

while (t && last != t) {// t存在，且变化

var r = []; // ret的tempValue

last = t; // last:上一次的t

t = jQuery.trim(t);// 去首尾空格

var foundToken = false, re = quickChild, // 以>开头的regexp

m = re.exec(t);

if (m) {// 首先判断是不是以>开头

nodeName = m[1].toUpperCase();

// 找到上下文的那些满足regexp中nodeName的所有子节点。

for (var i = 0;ret[i]; i++)

for (var c = ret[i].firstChild;c; c = c.nextSibling)

if (c.nodeType == 1

&& (nodeName == "*" || c.nodeName.toUpperCase() == nodeName))

r.push(c);

ret = r; // 现在找到的所有元素都是上下文（context)

t = t.replace(re, "");// remove已经处理过的部分

if (t.indexOf(" ") == 0)// 说明是 "E F"这样的形式

continue;// 循环就能找到所有

foundToken = true;// 找到标识

} else {// 第二判断是不是以+~开头

re = /^([>+~])\s*(\w*)/i;

if ((m = re.exec(t)) != null) {// 以+~开头的

r = [];

var merge = {};

nodeName = m[2].toUpperCase();// 节点名

m = m[1];// 符号，如+，~

// 如果参数t匹配" "或>（子元素），由context的第一个子元素开始遍历，

// 如果参数t匹配~或+（后续元素）,则从context的下一个元素开始遍历

for (var j = 0, rl = ret.length;j < rl; j++) {// 已经找到的节点（context)遍历

// 把~和+的操作统一在一起进行处理

var n = (m == "~" || m == "+"

? ret[j].nextSibling

: ret[j].firstChild);

for (;n; n = n.nextSibling)

if (n.nodeType == 1) {// 保证节点是元素类型

var id = jQuery.data(n);// 为n元素生成全局唯一的id

if (m == "~" && merge[id])// 保证ret中元素不重复

break;// nextSibling会循环到第一个节点？

if (!nodeName

|| n.nodeName.toUpperCase() == nodeName) {

if (m == "~")// 找到元素保存起来

merge[id] = true;

r.push(n);

}

if (m == "+")// 直接后续兄弟节点，只进行一次操作。

break;

}

}

ret = r;// 找到元素的后续操作

t = jQuery.trim(t.replace(re, ""));

foundToken = true;

}

}

if (t && !foundToken) {// 不是以>~+开头的

if (!t.indexOf(",")) {// ,分隔出现在第一个位置上

if (context == ret[0])

ret.shift();// 把初始化给定的context清除出ret

done = jQuery.merge(done, ret);// ret的其它元素放入done

r = ret = [context];// 重新初始化

// Touch up the selector string

t = " " + t.substr(1, t.length);

} else {// 采用,分隔的多表达式

/*

* qId:^((?:[\w*_-]|\.)+)(#)((?:[\w*_-]|\.)+)

* qclass:^([#.]?)((?:[\\w*_-]|\.)*)

*/

var re2 = quickID;// 如(.)nodeName#idName

var m = re2.exec(t);// 找到第一个相配的

if (m) {

m = [0, m[2], m[3], m[1]];// m=[0,#,idName,nodeName]

} else {

re2 = quickClass;// #nodeName,.className

m = re2.exec(t);// m=[all,#,idName]

}

m[2] = m[2].replace(/\\/g, "");// 去除转义字符

var elem = ret[ret.length - 1];// 结果数组最后一个

// 根据Id直接找到元素并确保其的确存在

if (m[1] == "#" && elem && elem.getElementById

&& !jQuery.isXMLDoc(elem)) {

var oid = elem.getElementById(m[2]);

// 回测元素的ID的确存在，在IE中会取name属性的值，同时在form 元素中

// 会选中在form中元素的name属性为id的元素。

if ((jQuery.browser.msie || jQuery.browser.opera) && oid

&& typeof oid.id == "string" && oid.id != m[2])

oid = jQuery('[@id="' + m[2] + '"]', elem)[0];

// 回测元素的node Name是否相同，如div#foo,可以提交效率

ret = r = oid && (!m[3] || jQuery.nodeName(oid, m[3]))

? [oid]

: [];

} else {// 找到结果集合中每个元素所有的后代元素组成集合，进行排查

for (var i = 0;ret[i]; i++) {

var tag = (m[1] == "#" && m[3] ? m[3] : (m[1] != ""

|| m[0] == "" ? "*" : m[2]));// 分情况取tagName

if (tag == "*"

&& ret[i].nodeName.toLowerCase() == "object")

tag = "param";// Handle IE7 being really dumb

// about <object>s

r = jQuery.merge(r, ret[i].getElementsByTagName(tag));

}

if (m[1] == ".") // 根据class在找到结果集合中过滤

r = jQuery.classFilter(r, m[2]);

if (m[1] == "#") {// 对元素的id过滤，找到regexp给定id的元素

var tmp = [];

for (var i = 0;r[i]; i++)

if (r[i].getAttribute("id") == m[2]) {

tmp = [r[i]];

break;

}

r = tmp;

}

ret = r;

}

t = t.replace(re2, "");

}

}

if (t) {// 根据余下的selector，对找到的r集合中的元素进行过滤

var val = jQuery.filter(t, r);

ret = r = val.r;

t = jQuery.trim(val.t);// 去首尾空格

}

}

if (t)// selector出现，返回[]。

ret = [];

if (ret && context == ret[0])

ret.shift();// 去掉根上下文

done = jQuery.merge(done, ret);// 合并

return done;

},

// 找到r中element中的className中含有m 或不含有的所有的元素

classFilter : function(r, m, not) {

m = " " + m + " ";

var tmp = [];

for (var i = 0;r[i]; i++) {

var pass = (" " + r[i].className + " ").indexOf(m) >= 0;

if (!not && pass || not && !pass)

tmp.push(r[i]);

}

return tmp;

},

filter : function(t, r, not) {

var last;

while (t && t != last) {// t存在，且改变

last = t;

// Match: [@value='test'], [@foo]

// 1、^(\[) *@?([\w:-]+) *([!*$^~=]*) *('?"?)(.*?)\4 *\]/,

// Match: :contains('foo')

// 2、^(:)([\w-]+)\("?'?(.*?(\(.*?\))?[^(]*?)"?'?\)/,

// Match: :even, :last-child, #id, .class

// 3、new RegExp("^([:.#]*)(" + chars + "+)")],

// isSimple = /^.[^:#\[\.]*$/

var p = jQuery.parse, m;

for (var i = 0;p[i]; i++) {// 找到与jQuery.parse中regexp相配的

m = p[i].exec(t);

if (m) {

t = t.substring(m[0].length);

m[2] = m[2].replace(/\\/g, "");// 有可能会有没有转换的\去掉

break;

}

}

if (!m)// 与上面三种的regexp都不相配

break;

// ：not(.class) 处理不包含.class的其它的元素

if (m[1] == ":" && m[2] == "not")

// 性能上优化 m[3]是.class经常出现

r = isSimple.test(m[3])

? jQuery.filter(m[3], r, true).r

: jQuery(r).not(m[3]);

else if (m[1] == ".")// 性能上优化考虑

r = jQuery.classFilter(r, m[2], not);

else if (m[1] == "[") {// [@value='test']形式的属性选择

var tmp = [], type = m[3];// 符号，如=

for (var i = 0, rl = r.length;i < rl; i++) {

var a = r[i], z = a[jQuery.props[m[2]] || m[2]];// 元素的属性值

if (z == null || /style|href|src|selected/.test(m[2]))

z = jQuery.attr(a, m[2]) || '';// 几个特殊的处理

// [foo],[foo=aa][foo!=aa][foo^=aa][foo$=aa][foo~=aa]

if ((type == "" && !!z || type == "=" && z == m[5]

|| type == "!=" && z != m[5] || type == "^=" && z

&& !z.indexOf(m[5]) || type == "$="

&& z.substr(z.length - m[5].length) == m[5] || (type == "*=" || type == "~=")

&& z.indexOf(m[5]) >= 0)

^ not)

tmp.push(a);

}

r = tmp;

} else if (m[1] == ":" && m[2] == "nth-child") {// 性能考量

var merge = {}, tmp = [],

// parse equations like 'even', 'odd', '5', '2n', '3n+2',

// '4n-1', '-n+6'

test = /(-?)(\d*)n((?:\+|-)?\d*)/.exec(m[3] == "even" && "2n"

|| m[3] == "odd" && "2n+1" || !/\D/.test(m[3]) && "0n+"

+ m[3] || m[3]),

// 计算器(first)n+(last)，first=(-?)(\d*),last=((?:\+|-)?\d*)

first = (test[1] + (test[2] || 1)) - 0, last = test[3] - 0;

for (var i = 0, rl = r.length;i < rl; i++) {

var node = r[i], parentNode = node.parentNode, id = jQuery

.data(parentNode);

if (!merge[id]) {// 为元素的每个子节点标上顺序号，作了不重复标识

var c = 1;

for (var n = parentNode.firstChild;n; n = n.nextSibling)

if (n.nodeType == 1)

n.nodeIndex = c++;

merge[id] = true;

}

var add = false;

if (first == 0) {// 0不能作除数

if (node.nodeIndex == last)

add = true;

}

// 处理3n+2这种形式同时表达式要大于0

else if ((node.nodeIndex - last) % first == 0

&& (node.nodeIndex - last) / first >= 0)

add = true;

if (add ^ not)

tmp.push(node);

}

r = tmp;

} else {// 根据m[1]m[2]在Query.expr找到对应的处理函数

var fn = jQuery.expr[m[1]];

if (typeof fn == "object")

fn = fn[m[2]];

if (typeof fn == "string")

fn = eval("false||function(a,i){return " + fn + ";}");

// 执行处理函数过滤r

r = jQuery.grep(r, function(elem, i) {

return fn(elem, i, m, r);

}, not);

}

}

// Return an array of filtered elements (r)

// and the modified expression string (t)

return {

r : r,

t : t

};

},

// dir：nextSibling elem:element

dir : function(elem, dir) {

var matched = [], cur = elem[dir];

while (cur && cur != document) {

if (cur.nodeType == 1)

matched.push(cur);

cur = cur[dir];

}

return matched;

},

// dir：nextSibling result:deep cur:current. elem :no use

nth : function(cur, result, dir, elem) {

result = result || 1;

var num = 0;

for (;cur; cur = cur[dir])

if (cur.nodeType == 1 && ++num == result)

break;

return cur;

},

// 排除elem的n的后续兄弟元素节点。

sibling : function(n, elem) {

var r = [];

for (;n; n = n.nextSibling) {

if (n.nodeType == 1 && n != elem)

r.push(n);

}

return r;

}

});