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 相关文章推荐
CSS(js)限制页面显示的文本字符长度
Dec 27 Javascript
JS 精确统计网站访问量的实例代码
Jul 05 Javascript
键盘上一张下一张兼容IE/google/firefox等浏览器
Jan 28 Javascript
jQuery的:parent选择器定义和用法
Jul 01 Javascript
文本框倒叙输入让输入框的焦点始终在最开始的位置
Sep 01 Javascript
js实现不重复导入的方法
Mar 02 Javascript
Node.js学习之地址解析模块URL的使用详解
Sep 28 Javascript
Node.js成为Web应用开发最佳选择的原因
Feb 05 Javascript
npm全局模块卸载及默认安装目录修改方法
May 15 Javascript
利用vue.js把静态json绑定bootstrap的table方法
Aug 28 Javascript
详解easyui 切换主题皮肤
Apr 04 Javascript
微信公众号中的JSSDK接入及invalid signature等常见错误问题分析(全面解析)
Apr 11 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
PHP中比较时间大小实例
2014/08/21 PHP
PHP重置数组为连续数字索引的几种方式总结
2018/03/12 PHP
PHP架构及原理知识点详解
2019/12/22 PHP
JS面向对象编程 for Cookie
2010/09/19 Javascript
9行javascript代码获取QQ群成员具体实现
2013/10/16 Javascript
Javascript中的delete操作符详细介绍
2014/06/06 Javascript
javascript 中__proto__和prototype详解
2014/11/25 Javascript
详解JavaScript ES6中的Generator
2015/07/28 Javascript
javascript动态添加checkbox复选框的方法
2015/12/23 Javascript
jQuery插件EasyUI设置datagrid的checkbox为禁用状态的方法
2016/08/05 Javascript
jQuery简单自定义图片轮播插件及用法示例
2016/11/21 Javascript
jQuery将表单序列化成一个Object对象的实例
2016/11/29 Javascript
js数字计算 误差问题的快速解决方法
2017/02/28 Javascript
Vue.js组件tab实现选项卡切换
2020/03/23 Javascript
Vue 页面跳转不用router-link的实现代码
2018/04/12 Javascript
jQuery实现图片随机切换、抽奖功能(实例代码)
2019/10/23 jQuery
Vue 使用Props属性实现父子组件的动态传值详解
2019/11/13 Javascript
Javascript地址引用代码实例解析
2020/02/25 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
2020/06/16 Javascript
python模拟登录百度贴吧(百度贴吧登录)实例
2013/12/18 Python
Python中urllib2模块的8个使用细节分享
2015/01/01 Python
Python随手笔记之标准类型内建函数
2015/12/02 Python
python3实现UDP协议的服务器和客户端
2017/06/14 Python
python OpenCV学习笔记实现二维直方图
2018/02/08 Python
python构建深度神经网络(续)
2018/03/10 Python
django自带serializers序列化返回指定字段的方法
2019/08/21 Python
python科学计算之narray对象用法
2019/11/25 Python
django在保存图像的同时压缩图像示例代码详解
2020/02/11 Python
django 外键创建注意事项说明
2020/05/20 Python
Python‘==‘ 及 ‘is‘相关原理解析
2020/09/05 Python
CSS3 实现穿梭星空动画
2020/11/13 HTML / CSS
加大码胸罩、内裤和服装:Just My Size
2019/03/21 全球购物
Lacoste(法国鳄鱼)加拿大官网:以标志性的POLO衫而闻名
2019/05/15 全球购物
教师听课学习心得体会
2016/01/15 职场文书
浙江省杭州市平均工资标准是多少?
2019/07/09 职场文书
python 安全地删除列表元素的方法
2022/03/16 Python