jQuery选择器源码解读(七):elementMatcher函数


Posted in Javascript onMarch 31, 2015

要读懂Sizzle的Compile执行过程,首先需要弄清楚涉及的各个子程序的功能和关键变量和作用,我将逐一对jQuery-1.10.2版本的Compile代码进行说明,望能给予大家帮助。

elementMatcher(matchers)

1、源码

function elementMatcher(matchers) {

 return matchers.length > 1 ? function(elem, context, xml) {

  var i = matchers.length;

  while (i--) {

   if (!matchers[i](elem, context, xml)) {

    return false;

   }

  }

  return true;

 } : matchers[0];

}

2、功能

该函数返回一个函数,用来判定传入的elem是否符合匹配执行函数数组matchers,若不满足返回false,否则返回true。

若matchers仅有一个元素,则返回该元素本身,否则返回一个新函数——即代码中的function(elem, context, xml)函数。

返回函数效果有点类似于context.filter(selectors),当然,其结果仅仅返回true或false,而非jQuery对象。

3、参数
matchers——数组,每个元素都是非伪类的匹配器执行函数。例如:在实际执行过程中,div.map span:lt(10),其中div和,map的匹配执行函数就会作为matchers的两个元素传入elementMatcher函数来过滤span节点的父节点是否满足要求。

4、返回函数

4.1 若matchers多于1个元素,则返回如下函数:

function(elem, context, xml) {

 var i = matchers.length;

 while (i--) {

  if (!matchers[i](elem, context, xml)) {

   return false;

  }

 }

 return true;

}

4.1.1 功能
从matchers最后一个元素到第一个元素依次调用,以匹配传入的elem节点是否满足要求,全部满足返回true,否则返回false。

4.1.2 参数

elem——待检查的单个节点元素。

context——执行整个选择器字符串匹配的上下文节点,大部分时候是没有用途。

xml——当前搜索对象是HTML还是XML文档,若是HTML,则xml参数为false。

4.2 若matchers只有1个元素,则返回该元素本身。
4.2.1 功能
检查传入的elem是否与选择器匹配,若匹配返回true,否则返回false。

4.2.2 参数
同4.1.2参数说明。

Javascript 相关文章推荐
Jquery时间验证和转换工具小例子
Jul 01 Javascript
jQuery中;function($,undefined) 前面的分号的用处
Dec 17 Javascript
详解JavaScript UTC时间转换方法
Jan 07 Javascript
教你用javascript实现随机标签云效果_附代码
Mar 16 Javascript
js实现倒计时及时间对象
Nov 15 Javascript
js中数组插入、删除元素操作的方法
Feb 15 Javascript
jQuery实现div跟随鼠标移动
Aug 20 jQuery
微信小程序按钮去除边框线分享页面功能
Aug 27 Javascript
jquery validate 实现动态增加/删除验证规则操作示例
Oct 28 jQuery
如何实现echarts markline标签名显示自己想要的
Jul 20 Javascript
uniapp实现可滑动选项卡
Oct 21 Javascript
angular4实现带搜索的下拉框
Mar 25 Javascript
jQuery选择器源码解读(六):Sizzle选择器匹配逻辑分析
Mar 31 #Javascript
jQuery选择器源码解读(五):tokenize的解析过程
Mar 31 #Javascript
JavaScript制作windows经典扫雷小游戏
Mar 31 #Javascript
jQuery选择器源码解读(四):tokenize方法的Expr.preFilter
Mar 31 #Javascript
JavaScript制作简易的微信打飞机
Mar 31 #Javascript
JS获取表格内指定单元格html内容的方法
Mar 31 #Javascript
JS实现为表格动态添加标题的方法
Mar 31 #Javascript
You might like
深入理解:XML与对象的序列化与反序列化
2013/06/08 PHP
浅析PHP中call user func()函数及如何使用call user func调用自定义函数
2015/11/05 PHP
PHP strip_tags保留多个HTML标签的方法
2016/05/22 PHP
Laravel框架中Blade模板的用法示例
2017/08/30 PHP
收集的网上用的ajax之chat.js文件
2007/04/08 Javascript
在Windows上安装Node.js模块的方法
2011/09/25 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
简介JavaScript中的unshift()方法的使用
2015/06/09 Javascript
谈谈我对JavaScript中typeof和instanceof的深入理解
2015/12/25 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
angular ng-repeat数组中的数组实例
2017/02/18 Javascript
vue.js2.0 实现better-scroll的滚动效果实例详解
2018/08/13 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
2018/10/23 Javascript
element vue Array数组和Map对象的添加与删除操作
2018/11/14 Javascript
layui表格数据复选框回显设置方法
2019/09/13 Javascript
JavaScript实现猜数字游戏
2020/05/20 Javascript
Vue项目开发常见问题和解决方案总结
2020/09/11 Javascript
Vue组件生命周期运行原理解析
2020/11/25 Vue.js
[01:56]2014DOTA2西雅图邀请赛 MVP外卡赛老队长精辟点评
2014/07/09 DOTA
简单解析Django框架中的表单验证
2015/07/17 Python
Python采用Django制作简易的知乎日报API
2016/08/03 Python
Python下的Softmax回归函数的实现方法(推荐)
2017/01/26 Python
Python操作Redis之设置key的过期时间实例代码
2018/01/25 Python
教你使用python画一朵花送女朋友
2018/03/29 Python
Python3中正则模块re.compile、re.match及re.search函数用法详解
2018/06/11 Python
在Pandas中给多层索引降级的方法
2018/11/16 Python
python 返回一个列表中第二大的数方法
2019/07/09 Python
Python使用lambda表达式对字典排序操作示例
2019/07/25 Python
使用python批量修改文件名的方法(视频合并时)
2020/03/24 Python
德国大型的家具商店:Pharao24.de
2016/10/02 全球购物
联想美国官方商城:Lenovo美国
2017/06/19 全球购物
北美最大的零售退货翻新商:VIP Outlet
2019/11/21 全球购物
2014年导购员工作总结
2014/11/18 职场文书
2014年学校教学工作总结
2014/12/06 职场文书
新教师教学工作总结
2015/08/12 职场文书
如何让vue长列表快速加载
2021/03/29 Vue.js