以下分析基于jQuery-1.10.2.js版本。
下面将以$("div:not(.class:contain('span')):eq(3)")为例,说明tokenize和preFilter各段代码是如何协调完成解析的。若想了解tokenize方法和preFilter类的每行代码的详细解释,请参看如下两篇文章:
https://www.jb51.net/article/63155.htm
https://www.jb51.net/article/63163.htm
下面是tokenize方法的源码,为了简便期间,我把有关缓存、逗号的匹配以及关系符的匹配的代码全部去掉了,只留了与当前例子有关的核心代码。被去掉的代码很简单,若需要可以看一下上述文章即可。
另外,代码统一写在说明文字上方。
复制代码 代码如下:
function tokenize(selector, parseOnly) {
var matched, match, tokens, type, soFar, groups, preFilters;
soFar = selector;
groups = [];
preFilters = Expr.preFilter;
while (soFar) {
if (!matched) {
groups.push(tokens = []);
}
matched = false;
for (type in Expr.filter) {
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;
}
}
return parseOnly "div:not(.class:contain('span')):eq(3)"作为selector参数传入该方法。
复制代码 代码如下:
soFar = selector;
soFar = "div:not(.class:contain('span')):eq(3)"
第一次进入while循环时,由于matched还未被赋值,所以执行if内的如下语句体,该语句将初始化tokens变量,同时,将tokens压入groups数组。
复制代码 代码如下:
groups.push(tokens = []);
之后,进入for语句。
第一次for循环:从Expr.filter中取出第一个元素"TAG"赋给type变量,执行循环体代码。
复制代码 代码如下:
if ((match = matchExpr[type].exec(soFar))
&& (!preFilters[type] || (match = preFilters[type]
(match)))) {
match = matchExpr[type].exec(soFar)的执行结果如下:
match =["div", "div"]
示例的第一个选择器为div,匹配matchExpr["TAG"]的正则表达式,且不存在preFilters["TAG"],故执行if内语句体。
复制代码 代码如下:
matched = match.shift();
移除match中的第一个元素div,并将该元素赋予matched变量,此时matched="div",match = ["div"]
复制代码 代码如下:
tokens.push({
value : matched,
type : type,
matches : match
}
创建一个新对象{ value: "div", type:"TAG", matches: ["div"] },并将该对象压入tokens数组。
复制代码 代码如下:
soFar = soFar.slice(matched.length);
soFar变量删除div,此时,soFar=":not(.class:contain('span')):eq(3)"
第二次for循环:从Expr.filter中取出第二个元素"CLASS"赋给type变量,执行循环体代码。
复制代码 代码如下:
if ((match = matchExpr[type].exec(soFar))
&& (!preFilters[type] || (match = preFilters[type]
(match)))) {
由于当前的soFar=":not(.class:contain('span')):eq(3)",不匹配CLASS类型的正则表达式,故结束本次循环。
第三次for循环:从Expr.filter中取出第三个元素"ATTR"赋给type变量,执行循环体代码。
同样,由于当前剩余选择器不是属性选择器,故结束本次循环。
第四次for循环:从Expr.filter中取出第四个元素"CHILD"赋给type变量,执行循环体代码。
同样,由于当前剩余选择器不是CHILD选择器,故结束本次循环。
第五次for循环:从Expr.filter中取出第五个元素"PSEUDO"赋给type变量,执行循环体代码。
复制代码 代码如下:
if ((match = matchExpr[type].exec(soFar))
&& (!preFilters[type] || (match = preFilters[type]
(match)))) {
match = matchExpr[type].exec(soFar)的执行结果如下:
[":not(.class:contain('span')):eq(3)", "not", ".class:contain('span')):eq(3", undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined]
由于存在preFilters["PSEUDO"],故执行其后的代码:
复制代码 代码如下:
match = preFilters[type](match)
preFilters["PSEUDO"]代码如下:
复制代码 代码如下:
"PSEUDO" : function(match) {
var excess, unquoted = !match[5] && match[2];
if (matchExpr["CHILD"].test(match[0])) {
return null;
}
if (match[3] && match[4] !== undefined) {
match[2] = match[4];
} else if (unquoted
&& rpseudo.test(unquoted)
&& (excess = tokenize(unquoted, true))
&& (excess = unquoted.indexOf(")", unquoted.length
- excess)
- unquoted.length)) {
match[0] = match[0].slice(0, excess);
match[2] = unquoted.slice(0, excess);
}
return match.slice(0, 3);
}
传入的match参数等于:
复制代码 代码如下:
[":not(.class:contain('span')):eq(3)", "not", ".class:contain('span')):eq(3", undefined, undefined, undefined, undefined, undefined
复制代码 代码如下:
unquoted = !match[5] && match[2]
unquoted = ".class:contain('span')):eq(3"
复制代码 代码如下:
if (matchExpr["CHILD"].test(match[0])) {
return null;
}
match[0] = ":not(.class:contain('span')):eq(3)",不匹配matchExpr["CHILD"]正则表达式,不执行return null语句。
复制代码 代码如下:
if (match[3] && match[4] !== undefined) {
match[2] = match[4];
}
由于match[3]和match[4]都等于undefined,故执行else的语句体。
复制代码 代码如下:
else if (unquoted
&& rpseudo.test(unquoted)
&& (excess = tokenize(unquoted, true))
&& (excess = unquoted.indexOf(")", unquoted.length - excess) - unquoted.length)
此时,unquoted = ".class:contain('span')):eq(3",为真,而且由于unquoted含有:contain('span'),与正则表达式rpseudo匹配,故rpseudo.test(unquoted)为真,然后再次调用tokenize对unquoted再次解析,如下语句:
复制代码 代码如下:
excess = tokenize(unquoted, true)
此次调用tokenize函数时,传入的selector参数等于".class:contain('span')):eq(3",parseOnly等于true。函数体内执行过程如下:
复制代码 代码如下:
soFar = selector;
soFar = ".class:contain('span')):eq(3"
第一次进入while循环时,由于matched还未被赋值,所以执行if内的如下语句体,该语句将初始化tokens变量,同时,将tokens压入groups数组。
复制代码 代码如下:
groups.push(tokens = []);
之后,进入for语句。
第一次for循环:从Expr.filter中取出第一个元素"TAG"赋给type变量,执行循环体代码。
复制代码 代码如下:
if ((match = matchExpr[type].exec(soFar))
&& (!preFilters[type] || (match = preFilters[type]
(match)))) {
由于当前剩余选择器不是TAG选择器,故结束本次循环。
第二次for循环:从Expr.filter中取出第二个元素"CLASS"赋给type变量,执行循环体代码。
match = matchExpr[type].exec(soFar)的执行结果如下:
match = ["class" , "class"]
由于不存在preFilters["CLASS"],故执行if内语句体。
复制代码 代码如下:
matched = match.shift();
移除match中的第一个元素class,并将该元素赋予matched变量,此时matched="class",match = ["class"]
复制代码 代码如下:
tokens.push({
value : matched,
type : type,
matches : match
}
创建一个新对象{ value: "class", type:"CLASS", matches: ["class"] },并将该对象压入tokens数组。
复制代码 代码如下:
soFar = soFar.slice(matched.length);
soFar变量删除class,此时,soFar = ":contain('span')):eq(3"
第三次for循环:从Expr.filter中取出第三个元素"ATTR"赋给type变量,执行循环体代码。
同样,由于当前剩余选择器不是属性选择器,故结束本次循环。
第四次for循环:从Expr.filter中取出第四个元素"CHILD"赋给type变量,执行循环体代码。
同样,由于当前剩余选择器不是CHILD选择器,故结束本次循环。
第五次for循环:从Expr.filter中取出第五个元素"PSEUDO"赋给type变量,执行循环体代码。
复制代码 代码如下:
if ((match = matchExpr[type].exec(soFar))
&& (!preFilters[type] || (match = preFilters[type]
(match)))) {
match = matchExpr[type].exec(soFar)的执行结果如下:
[":contain('span')", "contain", "'span'", "'", "span", undefined, undefined, undefined, undefined, undefined, undefined]
由于存在preFilters["PSEUDO"],故执行其后的代码:
复制代码 代码如下:
match = preFilters[type](match)
preFilters["PSEUDO"]代码如上所示,此处不再列举。
复制代码 代码如下:
"PSEUDO" : function(match) {
var excess, unquoted = !match[5] && match[2];
if (matchExpr["CHILD"].test(match[0])) {
return null;
}
if (match[3] && match[4] !== undefined) {
match[2] = match[4];
} else if (unquoted
&& rpseudo.test(unquoted)
&& (excess = tokenize(unquoted, true))
&& (excess = unquoted.indexOf(")", unquoted.length
- excess)
- unquoted.length)) {
match[0] = match[0].slice(0, excess);
match[2] = unquoted.slice(0, excess);
}
return match.slice(0, 3);
}
传入的match参数等于:
[":contain('span')", "contain", "'span'", "'", "span", undefined, undefined, undefined, undefined, undefined, undefined]
复制代码 代码如下:
unquoted = !match[5] && match[2];
unquoted = "span"
复制代码 代码如下:
if (matchExpr["CHILD"].test(match[0])) {
return null;
}
由于":contain('span')"不匹配matchExpr["CHILD"]正则表达式,故不执行内部语句体。
复制代码 代码如下:
if (match[3] && match[4] !== undefined) {
match[2] = match[4];
}
由于match[3] = "'",match[4] ="span",故执行if内部语句体,将"span"赋予match[2]
复制代码 代码如下:
return match.slice(0, 3);
返回match前三个元素的副本
此时回到tokenize方法的for循环内继续执行,此时各变量值如下:
match = [":contain('span')", "contain", "span"]
soFar = ":contain('span')):eq(3"
复制代码 代码如下:
matched = match.shift();
将":contain('span')"移除match数组,并赋予matched变量
复制代码 代码如下:
tokens.push({
value : matched,
type : type,
matches : match
}
创建一个新对象{ value:
":contain('span')", type:"PSEUDO", matches: ["contain", "span"] },并将该对象压入tokens数组。
复制代码 代码如下:
soFar = soFar.slice(matched.length);
soFar变量删除":contain('span')",此时,soFar="):eq(3)",之后,直至for循环结束,且再次执行while循环,也没有一个有效选择器,故退出while循环。
复制代码 代码如下:
return parseOnly "PSEUDO"]的代码
复制代码 代码如下:
else if (unquoted
&& rpseudo.test(unquoted)
&& (excess = tokenize(unquoted, true))
&& (excess = unquoted.indexOf(")", unquoted.length - excess) - unquoted.length)
将6赋予excess变量,然后由代码
复制代码 代码如下:
excess = unquoted.indexOf(")", unquoted.length - excess) - unquoted.length
计算出:not选择器结束位置(即右括号位置)22
复制代码 代码如下:
match[0] = match[0].slice(0, excess);
match[2] = unquoted.slice(0, excess);
分别计算出完整的:not选择器字符串(match[0])和其括号内的字符串(match[2]),分别等于:
match[0] = ":not(.class:contain('span'))"
match[2] = ".class:contain('span')"
复制代码 代码如下:
return match.slice(0, 3);
返回match中前三个元素的副本。
回到tokenize函数,此时match = [":not(.class:contain('span'))", "not", ".class:contain('span')"]
复制代码 代码如下:
matched = match.shift();
移除match中的第一个元素":not(.class:contain('span'))",并将该元素赋予matched变量,此时matched="":not(.class:contain('span'))"",
match = ["not", ".class:contain('span')"]
复制代码 代码如下:
tokens.push({
value : matched,
type : type,
matches : match
}
创建一个新对象{ value: ":not(.class:contain('span'))"", type:"PSEUDO", matches: ["not", ".class:contain('span')"] },并将该对象压入tokens数组。此时tokens共有两个元素分别是div和not选择器。
复制代码 代码如下:
soFar = soFar.slice(matched.length);
soFar变量删除":not(.class:contain('span'))",此时,soFar=":eq(3)",结束本次for循环后,再次回到while循环,同样方式,获取tokens的第三个元素eq选择器,过程与not一致,这里就不再细讲了。最后的groups的结果如下:
group[0][0] = {value: "div", type: "TAG", matches: ["div"] }
group[0][1] = {value: ":not(.class:contain('span'))", type: "PSEUDO", matches: ["not", ".class:contain('span')"] }
group[0][2] = {value: ":eq(3)", type: "PSEUDO", matches: ["eq", "3"] }
复制代码 代码如下:
return parseOnly "class:contain('span')):eq(3"时,将有效选择器的结果保存到缓存内,那么就可以避免再次解析,提高执行速度。但这也仅仅提高了当前这次运行速度。因为在执行过程中,对".class:contain('span')"再次提交解析时,会存入缓存。
至此,整个执行过程已经全部结束。
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。
更新日志
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果(九)》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]