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

if ( matches ) {
        // Check to see if it's possible to do matchesSelector
         // on a disconnected node (IE 9 fails this)
         var disconnectedMatch = !matches.call( document.createElement( "div" ), "div" ),
             pseudoWorks = false;

try {
            // This should fail with an exception
             // Gecko does not error, returns false instead
             matches.call( document.documentElement, "[test!='']:sizzle" );
   
         } catch( pseudoError ) {
             pseudoWorks = true;
         }

Sizzle.matchesSelector = function( node, expr ) {
             // Make sure that attribute selectors are quoted
             expr = expr.replace(/\=\s*([^'"\]]*)\s*\]/g, "='$1']");

if ( !Sizzle.isXML( node ) ) {
                 try {
                     if ( pseudoWorks || !Expr.match.PSEUDO.test( expr ) && !/!=/.test( expr ) ) {
                        var ret = matches.call( node, expr );

// IE 9's matchesSelector returns false on disconnected nodes
                      if ( ret || !disconnectedMatch ||
                                // As well, disconnected nodes are said to be in a document
                                 // fragment in IE 9, so check for that
                                 node.document && node.document.nodeType !== 11 ) {
                            return ret;
                        }
                    }
                 } catch(e) {}
            }

return Sizzle(expr, null, null, [node]).length > 0;
        };
     }
 })();

偶然在github上看到一个很好的是示例实现代码为

(function(global, ElemProto) {

var matchesMethod = (function() {
if (ElemProto.matchesSelector) {
return 'matchesSelector';
}

var prefixes = [ 'webkit', 'moz', 'ms', 'o' ];

for ( var i = 0, len = prefixes.length; i < len; i++) {
var prefix = prefixes[i];
var method = prefix + 'MatchesSelector';
if (ElemProto[method]) {
return method;
}
}
})();
console.log('abc');
// ----- match ----- //

function match(elem, selector) {
return elem[matchesMethod](selector);
}

// ----- appendToFragment ----- //

function checkParent(elem) {
// not needed if already has parent
if (elem.parentNode) {
return;
}
var fragment = document.createDocumentFragment();
fragment.appendChild(elem);
}

function query(elem, selector) {
// append to fragment if no parent
checkParent(elem);

// match elem with all selected elems of parent
var elems = elem.parentNode.querySelectorAll(selector);
for ( var i = 0, len = elems.length; i < len; i++) {
// return true if match
if (elems[i] === elem) {
return true;
}
}
// otherwise return false
return false;
}

// ----- matchChild ----- //

function matchChild(elem, selector) {
checkParent(elem);
return match(elem, selector);
}

// ----- matchesSelector ----- //

var matchesSelector;
if (matchesMethod) {

var div = document.createElement('div');
var supportsOrphans = match(div, 'div');
matchesSelector = supportsOrphans ? match : matchChild;
} else {
matchesSelector = query;
}
console.log(matchesSelector);
// transport
if (typeof define === 'function' && define.amd) {
// AMD
define('matches-selector/matches-selector', [], function() {
return matchesSelector;
});
} else {
// browser global
window.matchesSelector = matchesSelector;
}

})(this, Element.prototype);

源地址:https://gist.github.com/3062955

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

  1. [JQuery]JQuery选择器引擎Sizzle

    写代码过程中,发现使用JQuery选择器时,$('div.tooltip')和$('.tooltip')的结果不一样,怀疑和选择器的代码逻辑有关(事后证明是代码的低级错误,但是从查找原因的过程中,学到 ...

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

    目前在准备龙芯项目的PMON,在研究其编译过程的时候,看到一些make 语句,百思不得其解.后来在shell编程中看到一点资料,牵扯到Shell中的正则表达式.故记录下来,以备后来查阅. 问题: 在某 ...

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

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

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

    07.01自我总结 常用的re模块的正则匹配的表达式 一.校验数字的表达式 1.数字 ^[0-9]\*$ 2.n位的数字 ^\d{n}$ 3.至少n位的数字 ^\d{n,}$ 4.m-n位的数字 ^\ ...

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

    01 上节课回顾 受限的线性表 栈和队列的链式存储其实就是链表 但是不能任意操作 所以叫受限的线性表 02 栈的应用_就近匹配 案例1就近匹配: #include <stdio.h> in ...

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

    函数Sizzle(selector,context,results,seed)用于查找与选择器表达式selector匹配的元素集合.该函数是选择器引擎的入口. 函数Sizzle执行的6个关键步骤如下: ...

  7. JQuery前端技术记录

    [Jquery-leearning notes-2015]by lijun 1   Jquery是javascript实现的库,目标在于改变web应用的高交互性的方式. 其不唐突性:样式(.css). ...

  8. jquery的find()

    jQuery 遍历 - find() 方法 jQuery 遍历参考手册 实例 搜索所有段落中的后代 span 元素,并将其颜色设置为红色: $("p").find("sp ...

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

    jQuery的DOM遍历模块对DOM模型的原生属性parentNode.childNodes.firstChild.lastChild.previousSibling.nextSibling进行了封装 ...

随机推荐

  1. [转载] javascript实现深度克隆

    js一般有两种不同数据类型的值: 基本类型(包括undefined,Null,boolean,String,Number),按值传递: 引用类型(包括数组,对象),按址传递,引用类型在值传递的时候是内 ...

  2. excel表数据对比 个人收集

    做了那么久猿,转行做测试以后居然折堕到要用excel来对比数据...~—~.真是人算不如天算...不过没关系,技多不压身. 首先,准备好两个对比的数据表,sheet1 跟sheet2 .在sheet1 ...

  3. Android Fragment (二) 实例2

    由于看客的要求,我就把读者所要的写出来. 由于上一篇是每一个Fragment 实例了同一个layout.xml ,造成了读者的困惑,这篇我就让每一个Fragment 加载一个不同的layout.xml ...

  4. Outlook查找未读邮件

    1.查找新邮件的未读邮件,可以在下图中查找 2.恢复已删除邮件,如果邮件是未读邮件,在上图中是查找不到,只能通过视图去查找 步骤2内容摘自百度

  5. 北大poj-1081

    You Who? Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 801   Accepted: 273 Descriptio ...

  6. clojure 之 hello world

    1. 安装Leiningen 2. lein new app bar 3. lein run Hello, World!

  7. 关于LDA的几何表示——MATLAB实现

    承接这个PCA的练习,还有一个关于LDA的几何表示. 题目如下: 代码实现LDA如下:LDA.m clear clc % 生成training sample MU1 = [6 10]'; MU2 = ...

  8. Direct3D 10学习笔记(三)——文本输出

    本篇将简单整理Direct3D 10的文本输出的实现,具体内容参照< Introduction to 3D Game Programming with DirectX 10>(中文版有汤毅 ...

  9. PHP中FOREACH()用法

    PHP 4 引入了 foreach 结构,和 Perl 以及其他语言很像.这只是一种遍历数组简便方法.foreach 仅能用于数组,当试图将其用于其它数据类型或者一个未初始化的变量时会产生错误. 1. ...

  10. #import和@class的使用

    #import          #import 大部分功能和#include是一样的,但是他处理了重复引用的问题,不用再去自己进行重复引用处理. @class         用于声明一个类,告诉编 ...