原来选择器只支持一个上下文,并对IE8的BUG进行了规避

     if (!flag_xml && doc.querySelectorAll) {//FF,opera,chrome,safari的XML文档也实现了querySelectorAll接口,但不能用var query = expr;//IE的getElementsByTagName,querySelectorAll对OBJECT元素的孩子的查找都存在问题if( doc.documentMode === 8 && context.nodeType === 1 && context.nodeName.toLowerCase() !== "object"){var id = context.getAttribute( "id" ),uid = context.uniqueID//IE8在上下文为元素节时,搜索结果包含自己if ( !id ) {context.setAttribute( "id", uid );}try {return pushResult(context.querySelectorAll( "#" + uid + " " + query ),result,flag_multi);} catch(e) {} finally {if ( id == context.uniqueID ) {context.removeAttribute( "id" );}}}else{if(/\!\=/.test(query))//手动支持 E[Attr!=Val]query = query.replace(/\[\s*(\w+)\s*!=\s*((['"]*).*?\3)\s*\]/g,":not([$1=$2])");try {return pushResult( context.querySelectorAll(query) ,result,flag_multi);} catch(e) {}}}

改进如下,现在只需规避IE的OBJECT bug。

            if (!flag_xml && doc.querySelectorAll) {//http://www.w3.org/TR/selectors/node = context;//使用替身,以便在多上下文实现不重排查找var useContains = false;if(contexts.length > 2 || doc.documentMode === 8 && context.nodeType === 1){node = doc;useContains = true;}if(doc.documentMode !== 8  ||  node.nodeName.toLowerCase() !== "object"){try{nodes = pushResult( node.querySelectorAll(expr) ,result,flag_multi);var ret = []if(useContains && nodes.length){var cn = contexts.length;for(i = 0, ri = 0; i < nodes.length; i++){inner:for(var c = 0; c < cn; c++){if(dom.contains(contexts[c], nodes[i])){ret.push(nodes[i])break inner;}}}return ret;}return result;}catch(e){}}}

另一种改进是,通过对元素节点的上下文添加一个类名,这样查找就可以一步到位。不足之处就是前前后后要对类进行操作。

            if (!flag_xml && doc.querySelectorAll) {var query = expr;if(contexts.length > 2 || doc.documentMode == 8  && context.nodeType == 1  ){if(contexts.length > 2 )context = doc;query = ".fix_icarus_sqa "+query;//IE8也要使用类名确保查找范围for(i = 0; node = contexts[i++];){if(node.nodeType === 1){node.className = "fix_icarus_sqa " + node.className;}}}if(doc.documentMode !== 8  || context.nodeName.toLowerCase() !== "object"){try{result = pushResult( context.querySelectorAll(query) ,result,flag_multi);if(query.indexOf(".fix_icarus_sqa") === 0 ){//如果为上下文添加了类名,就要去类名for(i = 0; node = contexts[i++];){if(node.nodeType === 1){node.className =  node.className.replace(" fix_icarus_sqa","");}}}return result;}catch(e){}}}

但显然对类进行操作对调用dom.contains快捷得多了。

querySelector用法改进相关推荐

  1. 原生JS DOM操作方法汇总

    创建节点 1. document.createElement(tagname) 创建一个由tagName决定的HTML元素 2. document.createTextNode(data) 创建一个文 ...

  2. JavaScript 教程(二)

    面向对象编程 实例对象与 new 命令 JavaScript 语言具有很强的面向对象编程能力,这里介绍 JavaScript 面向对象编程的基础知识 对象是什么 面向对象编程(Object Orien ...

  3. PE经典DIY案例1:全解开方案让量产PE也能

    更新说明:因未来的uefi似乎并不能识别并引导ud区,但能识别和引导量产和u+B+隐藏或高端隐藏区,故解决量产PE对u+B+隐藏区的支持,并增加对UEFI启动支持,已经成为PE制作的最主流技术. PE ...

  4. JavaScript基础12-day14【DOM查询(获取元素节点、获取元素节点的子节点)、全选练习、DOM增删改、DOM添加删除记录、Window对象方法】

    学习地址: 谷粒学院--尚硅谷 哔哩哔哩网站--尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通) JavaScript基础.高级学习笔记汇总表[尚硅谷最新版Ja ...

  5. thinkphp5.1 php7,空白目录 · 细数ThinkPHP5.1.7版本新特性 · 看云

    >[danger] 官方已经在前不久发布了ThinkPHP`5.1.7`版本,`5.1`版本相较于`5.0`版本而言,本身更加严谨和规范,更接近主流设计思想.近半年来,`5.1`版本更新频繁,此 ...

  6. JS中DOM节点的CRUD

    <!DOCTYPE html> <html><head><meta charset="UTF-8"><title>< ...

  7. JavaScript基础知识总结 18:dom基本操作

    目录 一.JavaScript多选框全选.全不选.反选 1.代码实例 2.浏览器显示 二.dom查询方法 1.body标签 2.html根标签 3.all 4.getElementsByClassNa ...

  8. JavaScript 教程(二) 1

    面向对象编程 实例对象与 new 命令 JavaScript 语言具有很强的面向对象编程能力,这里介绍 JavaScript 面向对象编程的基础知识 对象是什么 面向对象编程(Object Orien ...

  9. 前端基础入门之js什么是DOM Document Object Model

    文章目录 DOM 1.DOM简介 文档 对象 模型 2.节点 节点类型 节点属性 文档节点(Document) 元素节点(Element) 文本节点(Text) 属性节点(Attr) 3.事件 4.文 ...

最新文章

  1. 多目标跟踪 | AI产品经理需要了解的CV通识(三)
  2. 神经网络谐振子模型的一组数据
  3. wpf项目源代码_C# WPF开源控件库:MahApps.Metro
  4. NYOJ 257 郁闷的C小加(一)
  5. torch.gather(input, dim, index, *, sparse_grad=False, out=None) → Tensor
  6. 卡方 python_Python评分卡建模—卡方分箱
  7. Angular内提供了一个可以快速建立测试用web服务的方法:内存 (in-memory) 服务器...
  8. 自研redis sdk支持自动dns切换(附源码)
  9. 炸窝(Collections当中的addAll方法)
  10. python 38day--CSS简介
  11. centos 安装及vim使用
  12. vscode创建代码片段
  13. python安装在什么地方_python模块安装目录在哪里
  14. 猪年的第一天没有压岁钱
  15. linux centos系统清理垃圾,centos 清理内存缓存
  16. 【流量池】裂变营销:10种人脉裂变技能,6个裂变核心,8个吸粉人性本能怎样玩粉丝裂变?
  17. 操作系统(02326)自考学习笔记/备考资料
  18. 如何判断蓝牙设备类型
  19. 暗影精灵2pro装Linux系统,暗影精灵2不支持linux双系统吗?
  20. 基于HTML和CSS完成京东页面的制作

热门文章

  1. 我的Android进阶之旅------gt;Android字符串资源中的单引號问题error: Apostrophe not preceded by 的解决的方法...
  2. Spring-AOP实践 - 统计访问时间
  3. 【OPENGL】第三篇 着色器基础(一)
  4. 怎么在代码中打开、关闭屏幕旋转
  5. 注意服务器系统日期对防病毒软件的影响
  6. 弯曲圆波导matlab_弯曲波导结构设计
  7. 汇编语言——键盘输入字符
  8. Android源码分析-全面理解Context
  9. HTML DOM Document 对象
  10. 贪心、递归、递推以及动态规划算法的分析与对比