Sizzle词法解析

sizzle对于分组过滤处理都用正则,其中都有一个特点,就是都是元字符^开头,限制匹配的初始,所以tokenize也是从左边开始一层一层的剥离。

•可能会应用到正则如下:

// 空白
var whitespace = "[\\x20\\t\\r\\n\\f]"; // 匹配\后任意字符,字母或数字或-,ascii值非\x00-\xa0范围内的字符
var characterEncoding = "(?:\\\\.|[\\w-]|[^\\x00-\\xa0])+" var identifier = characterEncoding.replace( "w" , "w#" ) // 匹配关系符> + ~
var rcombinators = new RegExp( "^" + whitespace + "*([>+~]|" + whitespace + ")" + whitespace + "*" ) // 匹配=[非'非"]
var rattributeQuotes = new RegExp( "=" + whitespace + "*([^\\]'\"]*?)" + whitespace + "*\\]" , "g" )

•正则组合:

///^#((?:\\.|[\w-] | [^\x00-\xa0] ) +)/var ID = new RegExp("^#(" + characterEncoding + ")")

匹配ID,例如:$('#id')

var TAG =  new RegExp( "^(" + characterEncoding.replace( "w", "w*" ) + ")" );

匹配标签,例如:$('input')

var Class = new RegExp( "^\\.(" + characterEncoding + ")" );

匹配class名,例如:$('.test')

attributes = "\\[" + whitespace + "*(" + characterEncoding + ")" + whitespace +
"*(?:([*^$|!~]?=)" + whitespace + "*(?:(['\"])((?:\\\\.|[^\\\\])*?)\\3|(" + identifier + ")|)|)" + whitespace + "*\\]"
匹配属性选择器,例如:[arr^='val']
   捕获组1:characterEncoding :匹配例子中arr
   捕获组2:([*^$|!~]?=):匹配例子中^=
   捕获组3:['\"]:匹配例子中'
   捕获组4:(?:\\\\.|[^\\\\])*? 解释一下这个外层捕获\和后面的任意数量字符或非\字符,内层有?:是不捕获的,匹配例子中的val
   捕获组5:匹配identifier,匹配[id=#a]的情况
 
pseudos = ":(" + characterEncoding + ")(?:\\(((['\"])((?:\\\\.|[^\\\\])*?)\\3|((?:\\\\.|[^\\\\()[\\]]|" + attributes.replace( 3, 8 ) + ")*)|.*)\\)|)"  
匹配伪类表达式,例如li:nth-child(2n+1)
   捕获组1:characterEncoding :匹配例子中nth-child
   捕获组2:匹配例子中的2n+1
   捕获组3:匹配' or "
   捕获组4:匹配\和后面任何字符或非\字符
   捕获组5:匹配不再' or "内的\和后面任意字符或非\()[]字符或attributes

(五)JS学习笔记 - Sizzle选择器的更多相关文章

  1. JQuery学习笔记——层级选择器

    JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...

  2. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  3. 基于jquery的插件turn.js学习笔记

    基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...

  4. 系列文章--Node.js学习笔记系列

    Node.js学习笔记系列总索引 Nodejs学习笔记(一)--- 简介及安装Node.js开发环境 Nodejs学习笔记(二)--- 事件模块 Nodejs学习笔记(三)--- 模块 Nodejs学 ...

  5. WebGL three.js学习笔记 6种类型的纹理介绍及应用

    WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学 ...

  6. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

  7. 《Linux内核设计与实现》课本第五章学习笔记——20135203齐岳

    <Linux内核设计与实现>课本第五章学习笔记 By20135203齐岳 与内核通信 用户空间进程和硬件设备之间通过系统调用来交互,其主要作用有三个. 为用户空间提供了硬件的抽象接口. 保 ...

  8. JS 学习笔记--9---变量-作用域-内存相关

    JS 中变量和其它语言中变量最大的区别就是,JS 是松散型语言,决定了它只是在某一个特定时间保存某一特定的值的一个名字而已.由于在定义变量的时候不需要显示规定必须保存某种类型的值,故变量的值以及保存的 ...

  9. WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)

    WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...

随机推荐

  1. javascript将form表单中的元素值封装成json格式

    把form表单中的元素值封装成json function toJSON(form)//form是要进行封装的form表单对象,dom对象,可以通过document.mainForm获得,mainFor ...

  2. IE6\ IE7、IE8\9\10和Firefox的hack方式

    #test{color:red;color:red !important;/ Firefox.IE7支持 */_color:red; / IE6支持 */*color:red; / IE6.IE7支持 ...

  3. 转:Windows下载Android源码

    原文来自于:http://blog.csdn.net/hlf48641715/article/details/7188450 下载msysgit,安装 官方下载:http://code.google. ...

  4. obj文件的连接问题以及tlib的基本用法

    1.基础研究 用tcc将程序编译为.obj文件. 这里也可以使用tcc -linclude run.c来将run.c文件编译成run.obj文件. 再用tcc对下面的程序进行编译链接,发现提示错误: ...

  5. WPF自定义控件与样式(15)-终结篇

    原文:WPF自定义控件与样式(15)-终结篇 系列文章目录  WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与 ...

  6. git中的常用指令名及其意义

    add 添加新文件到 Git 代码仓库的索引中 $ git add filename mv 移动或重命名文件 $ git mv old-filename new-filename rm 从工作目录和 ...

  7. String和数字之间的转化

    主要是JDK的代码,还是比较的经典,值得一看,例如: package alg; /** * @author zha 字符串之间的转化 */ public class Alg3StringToint { ...

  8. apache shiro内置过滤器 标签 注解

    内置过滤器 anon(匿名)  org.apache.shiro.web.filter.authc.AnonymousFilter authc(身份验证)       org.apache.shiro ...

  9. appium windows 命令行中运行以及targetSdkVersionFromManifest failed的解决

    启动appium服务,可以通过appium.exe可执行文件启动,也可以通过命令行启动.appium.exe启动需要通过安装可执行文件,命令行启动需要通过npm安装appium.可执行文件启动方式如下 ...

  10. SQL VS NoSQL

    (关系型与非关系型)数据库的区别: 关系型和非关系型数据库的主要差异是数据存储的方式 1.1 数据表 VS 数据集 关系型数据天然就是表格式的,因此存储在数据表的行和列中.数据表可以彼此关联协作存储, ...