matchesSelector 匹配选择器表达式sizzle的实现

【matchesSelector 匹配选择器表达式sizzle的实现】的更多相关文章

matchesSelector 匹配选择器表达式sizzle的实现

Sizzle.matchesSelector = function( node, expr ) { return Sizzle( expr, null, null, [node] ).length > 0; }; (function(){ var html = document.documentElement, matches = html.matchesSelector || html.mozMatchesSelector || html.webkitMatch…

[JQuery]JQuery选择器引擎Sizzle

写代码过程中,发现使用JQuery选择器时,$('div.tooltip')和$('.tooltip')的结果不一样,怀疑和选择器的代码逻辑有关(事后证明是代码的低级错误,但是从查找原因的过程中,学到了不少东西),于是去学习了下JQuery选择器引擎Sizzle,以及选择器的优先级. 1.Sizzle引擎在jq1.3之前,选择器采用的是顺序的思维方式,在需要递进匹配时,例如$('div span'),执行的操作是先匹配div标签,再匹配div标签下的span标签,最后返回结果.而Sizzle采…

Linux shell中的一个问题 ${}带正则匹配的表达式

目前在准备龙芯项目的PMON,在研究其编译过程的时候,看到一些make 语句,百思不得其解.后来在shell编程中看到一点资料,牵扯到Shell中的正则表达式.故记录下来,以备后来查阅. 问题: 在某个makefile文件中通过include引入某个文件进来 Include $(shell ./getname) 而getname中的内容即为: pwd=$(pwd); if [ "${pwd#*/zloader.}" = "$pwd" ];then echo Make…

jquery 通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素（比如由脚本创建的新元素）

jquery 通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素(比如由脚本创建的新元素) $("ul").append("<li class='name'>名称</li>"); [错误] 然后通过下面的方式, 这样是不能获取的 : $(".name").click(function (){ alert("获取到append后的节点"); }) [正确] 正确的方法是:…

常用的re模块的正则匹配的表达式

07.01自我总结常用的re模块的正则匹配的表达式一.校验数字的表达式 1.数字 ^[0-9]\*$ 2.n位的数字 ^\d{n}$ 3.至少n位的数字 ^\d{n,}$ 4.m-n位的数字 ^\d{m,n}$ 5.零和非零开头的数字 ^(0|[1-9][0-9]\*)$ 6.非零开头的最多带两位小数的数字 ^([1-9][0-9]\*)+(\.[0-9]{1,2})?$ 7.带1-2位小数的正数或负数 ^(\-)?\d+(\.\d{1,2})$ 8.正数.负数.和小数 ^(\-|\+)?\…

数据结构(3) 第三天栈的应用:就近匹配/中缀表达式转后缀表达式、树/二叉树的概念、二叉树的递归与非递归遍历(DLR LDR LRD)、递归求叶子节点数目/二叉树高度/二叉树拷贝和释放

01 上节课回顾受限的线性表栈和队列的链式存储其实就是链表但是不能任意操作所以叫受限的线性表 02 栈的应用_就近匹配案例1就近匹配: #include <stdio.h> int main() { int a[4][4];int(*p)[4];p = a[0]; return 0;} 扫描字符串如果碰到左括号直接入栈如果碰到右括号从栈顶弹出括号,判断是否是左括号, 如果是匹配成功如果不是匹配失败 #define _CRT_SECURE_NO_WARNINGS #inc…

十七.jQuery源码解析之入口方法Sizzle(1)

函数Sizzle(selector,context,results,seed)用于查找与选择器表达式selector匹配的元素集合.该函数是选择器引擎的入口. 函数Sizzle执行的6个关键步骤如下: 1.解析选择器表达式,解析出块表达式和关系符. 2.如果存在位置伪类,则从左向右查找: a.查找第一个块表达式匹配的元素集合,得到第一个上下文元素集合. b.遍历剩余的块表达式和块间关系符,不断缩小上下文元素集合. 3.否则从右向左查找: a.查找最后一个块表达式匹配的元素集合,得到候选集,映射集…

JQuery前端技术记录

[Jquery-leearning notes-2015]by lijun 1 Jquery是javascript实现的库,目标在于改变web应用的高交互性的方式. 其不唐突性:样式(.css).脚本文件(.js)从页面结构中分离出来,页面结构(body)专注于标签元素的设计布局: <html> <head>   </head> <body> <!--结…

jquery的find()

jQuery 遍历 - find() 方法 jQuery 遍历参考手册实例搜索所有段落中的后代 span 元素,并将其颜色设置为红色: $("p").find("span").css('color','red'); 亲自试一试定义和用法 find() 方法获得当前元素集合中每个元素的后代,通过选择器.jQuery 对象或元素来筛选. 语法 .find(selector) 参数描述 selector 字符串值,包含供匹配当前元素集合的选择器表达式. 详细说明…

jQuery 源码分析(十九) DOM遍历模块详解

jQuery的DOM遍历模块对DOM模型的原生属性parentNode.childNodes.firstChild.lastChild.previousSibling.nextSibling进行了封装和扩展,用于在DOM树中遍历父元素.子元素和兄弟元素. 可以通过jQuery的实例来访问,方法如下: parent() ;获取匹配元素的父元素 parents(selector) ;获取匹配元素的所有祖先元素 ;s…

jQuery-1.9.1源码分析系列（三） Sizzle选择器引擎——一些有用的Sizzle API

说一下Sizzle中零碎的API.这些API有的被jQuery接管,直接使用jQuery.xxx就可以使用,有的没有被接管,如果要在jQuery中使用,使用方法是jQuery.find.xxx. 具体看一下有哪些API //筛选出elements满足CSS选择器表达式expr的节点[最终返回的是节点数组]Sizzle.matches = function( expr, elements ) {...} //判断dom元素elem是否匹配CSS选择器表达式exprSizzle.matchesSel…

jQuery-1.9.1源码分析系列（三） Sizzle选择器引擎——编译原理

这一节要分析的东东比较复杂,篇幅会比较大,也不知道我描述后能不能让人看明白.这部分的源码我第一次看的时候也比较吃力,现在重头看一遍,再分析一遍,看能否查缺补漏. 看这一部分的源码需要有一个完整的概念后去看才比较容易看懂,所以我们先把整个编译的原理阐述以后再进行解析. 还是以上次的那个CSS选择器为例:#chua > a + .group labe[for="age"].按照我们正常解析CSS的思路从右往左解析(这是效率较高的处理方法),解析之前词法分析完毕,词法分析结果保存在to…

jQuery源码分析系列（二）Sizzle选择器引擎-上

前言我们继续从init()方法中的find()方法往下看, jQuery.find = Sizzle; ... find: function (selector) { /** ... */ ret = this.pushStack([]); // 还是调用的递归栈方法 for (i = 0; i < len; i++) { jQuery.find(selector, self[i], ret); // 寻找selector,也就是进入Sizzle构造函数 } return len > 1 ?…

jQuery-1.9.1源码分析系列（三） Sizzle选择器引擎——总结与性能分析

Sizzle引擎的主体部分已经分析完毕了,今天为这部分划一个句号. a. Sizzle解析流程总结是时候该做一个总结了.Sizzle解析的流程已经一目了然了. 1.选择器进入Sizzle( selector, context, results, seed )函数,先对选择器不符合要求的(比如没有选择器.选择器不为字符串.上下文环境context不是节点元素且不是document)排除,直接返回:接着判断如果选择器是简单的选择器(只有一个元选择器,比如“#ID”.“.CLASS”.“TAG”等)…

Sizzle选择器引擎介绍

一.前言 Sizzle原来是jQuery里面的选择器引擎,后来逐渐独立出来,成为一个独立的模块,可以自由地引入到其他类库中.我曾经将其作为YUI3里面的一个module,用起来畅通无阻,没有任何障碍.Sizzle发展到现在,以jQuery1.8为分水岭,大体上可以分为两个阶段,后面的版本中引入了编译函数的概念,Sizzle的源码变得更加难读.不再兼容低版本浏览器,而且看起来更加零散.本次阅读的是Sizzle第一个阶段的最终版本jQuery1.7,从中收获颇多,一方面是框架设计的思路,另外一方面是…

jQuery选择器引擎和Sizzle介绍

一.前言 Sizzle原来是jQuery里面的选择器引擎,后来逐渐独立出来,成为一个独立的模块,可以自由地引入到其他类库中.我曾经将其作为YUI3里面的一个module,用起来畅通无阻,没有任何障碍.Sizzle发展到现在,以jQuery1.8为分水岭,大体上可以分为两个阶段,后面的版本中引入了编译函数的概念,Sizzle的源码变得更加难读.不再兼容低版本浏览器,而且看起来更加零散.本次阅读的是Sizzle第一个阶段的最终版本jQuery1.7,从中收获颇多,一方面是框架设计的思路,另外一方面是…

sizzle源码分析（2）ID 类 tag querySelectorAll 快速匹配

不是所有的选择器都需要去分词,生成相应的匹配函数,这样流程比较复杂,当浏览器具备原生的方法去匹配元素是,没有理由不优先匹配,下面看看进入Sizzle后,它是怎么优先匹配这些元素的: function Sizzle( selector, context, results, seed ) { /* 执行$("ul.list>li span:eq(1)")时,递归第二次时, selector "ul.list>li span" */ var match, el…

jQuery Sizzle选择器（二）

自己开始尝试读Sizzle源码. 1.Sizzle同过自执行函数的方式为自己创建了一个独立的作用域,它可以不依赖于jQuery的大环境而独立存在.因此它可以被应用到其它js库中.实现如下:(function(window, undefined){})(window, undefined); 2.Sizzle中最头疼的就是一大片的复杂正则表达式: // 为正则准备的字符串.匹配选择器中的布尔值,例如 $( "input:checked" ); booleans = "…

jQuery Sizzle选择器（一）

1.浏览器对css选择器采取逆向(从右向左)解析的原因: 如果正向解析,例如「div div p em」,我们首先就要检查当前元素到 html 的整条路径,找到最上层的div,再往下找,如果遇到不匹配就必须回到最上层那个 div,往下再去匹配选择器中的第一个 div,回溯若干次才能确定匹配与否,效率很低. 逆向匹配则不同,如果当前的 DOM 元素是 div,而不是 selector 最后的 em,那只要一步就能排除.只有在匹配时,才会不断向上找父节点进行验证.找到所有的em之后,再通过查找他的父…

一种基于匹配回朔的 css3 选择器引擎实现

介绍 CSS 选择器是一种应用于 DOM 节点查找场景的特定微型语法, 本质上和正则表达式一样都是一种模式匹配语言,灵活使用可以方便得获取指定位置的节点集合. 目前 W3C 推荐标准为 Selectors Level 3 , 在 ie9+ 以及 firefox,chrome,mobile 等浏览器上原生有基本一致的实现,而在 ie 下则需要使用 javascript 模拟实现,本文介绍一种基于匹配回朔的 css3 选择器引擎实现,特定应用于 ie6,7,8 下. 语法 css 选择器是一种紧凑…

[转]JQuery - Sizzle选择器引擎原理分析

原文: https://segmentfault.com/a/1190000003933990 ----------------------------------------------------------------------- 说明:14年学习的jquery源码,搬到这里供大家交流. 一.前言 Sizzle原来是jQuery里面的选择器引擎,后来逐渐独立出来,成为一个独立的模块,可以自由地引入到其他类库中.我曾经将其作为YUI3里面的一个module,用起来畅通无阻,没有任何障碍.S…

filter(expr|obj|ele|fn)筛选出与指定表达式匹配的元素集合。

filter(expr|obj|ele|fn) 概述筛选出与指定表达式匹配的元素集合. 这个方法用于缩小匹配的范围.用逗号分隔多个表达式参数 exprStringV1.0 字符串值,包含供匹配当前元素集合的选择器表达式.大理石平台价格表 jQuery objectobjectV1.0 现有的jQuery对象,以匹配当前的元素. elementExpressionV1.4 一个用于匹配元素的DOM元素. function(index)FunctionV1.4 一个函数用来作为测试元素的集合.它…

PHP--正则表达式和样式匹配--小记

正则表达式: Regular expression PHP 支持两种风格的函数: POSIX 风格的,有些低版本软件支持,目前高版本的有些已经废弃不用了,比如 zend studio 的较新版本. posix 风格对应的样式匹配函数主要是 ereg() 函数,比如 ereg("^boy","boy11") 判断boy11是否符合以boy开头的字符串. ---------------------------------------------------------…

jQuery1.11源码分析(3)-----Sizzle源码中的浏览器兼容性检测和处理[原创]

上一章讲了正则表达式,这一章继续我们的前菜,浏览器兼容性处理. 先介绍一个简单的沙盒测试函数. /** * Support testing using an element * @param {Function} fn Passed the created div and expects a boolean result */ //特性检测的一个技巧,造一个div,最后将其删掉,提供一种简单的沙盒(如果该div不加入到DOM树上,则部分属性如currentStyle会没有) function a…

jQuery 2.0.3 源码分析Sizzle引擎 - 词法解析

声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 浏览器从下载文档到显示页面的过程是个复杂的过程,这里包含了重绘和重排.各家浏览器引擎的工作原理略有差别,但也有一定规则. 简单讲,通常在文档初次加载时,浏览器引擎会解析HTML文档来构建DOM树,之后根据DOM元素的几何属性构建一棵用于渲染的树.渲染树的每个节点都有大小和边距等属性,类似于盒子模型(由于隐藏元素不需要显示,渲染树中并不包含DOM树中隐藏的元素). 当渲染树构建完成后,浏览器就可以将元素放置到正确的位置了,…