支持的浏览IE8+,Firefox3.5+,Safari3.1+ Chrome和Opera 10+

1.querySelector()方法接收一个选择符,返回第一个匹配的第一个元素,如果没有返回null

eg:var body = document.querySelector('body');

  var myDiv = document.querySelector('#myDiv');

  var selected = document.querySelector('.selected');

  var img = document.body.querySelector('img .button');

2.querySelectorAll()方法返回的一个NodeList的实例。

eg: var ems = document.getElementById('myDiv').querySelectorAll('em');

  var strongs = document.querySelectorAll('p strong');

3.matchesSelector(),Eelement类型新增的方法。接收css 选择符,如果调用元素与该选择符匹配,返回true,否则返回false

目前除IE6-IE8,Firefox/Chrome/Safari/Opera/IE 的最新版本均已实现,但方法都带上了各自的前缀.

function matchesSelector(element,selector){

  if(element.matchesSelector){

    return element.matchesSelector(selector);

  }else if(element.msMatchesSelector){

    return element.msMatchesSelector(selector);

  }else if(element.mozMatchesSelector){

    return element.mozMatchesSelector(selector);

  }else if(element.webkitMatchesSelector){

    return element.webkitMatchesSelector(selector);

  }else{

  }

}

HTML5中类jQuery选择器querySelector和querySelectorAll的使用的更多相关文章

  1. HTML5中类jQuery选择器querySelector的高级使用 document.querySelectorAll.bind(document);

    基本用法 querySelector 该方法返回满足条件的单个元素.按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找,返回第一个满足条件的元素. ----> querySe ...

  2. HTML5中类jQuery选择器querySelector的使用

    简介 HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的 ...

  3. javascript选择器querySelector和querySelectorAll的使用和区别

    querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...

  4. js高级选择器querySelector和querySelectorAll

    querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...

  5. 重要选择器querySelector和querySelectorAll

    他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏览器均支持了他们.包括 IE8(含) 以上版本. Firefox. Chrome.Safari.Opera. queryS ...

  6. 高级选择器querySelector和querySelectorAll

    Javascript新提供的querySelector和querySelectorAll方法,是仿照CSS选择器功能编写的 querySelector 功能:该方法返回满足条件的单个元素.按照深度优先 ...

  7. 强大的原生DOM选择器querySelector和querySelectorAll

    在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...

  8. 原生JS强大DOM选择器querySelector与querySelectorAll

    在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...

  9. javascript高级选择器querySelector和querySelectorAll

    querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...

随机推荐

  1. day 54 Django基础四之模板系统

    Django基础四之模板系统   本节目录 一 语法 二 变量 三 过滤器 四 标签Tags 五 模板继承 六 组件 七 自定义标签和过滤器 八 静态文件相关 一 语法   模板渲染的官方文档 关于模 ...

  2. springcloud系列14 bus的使用

    首先springcloud_bus原理: (1)完整流程:发送端(endpoint)构造事件event,将其publish到context上下文中(spring cloud bus有一个父上下文,bo ...

  3. Bootstrap——设置Tab标签切换

    最近一个小项目需要用Tab标签切换显示不同div内容,用到了Bootstrap里面的东西,但是在Bootstrap3教程里却没有找到对应的代码,这里记录一下,方便以后快速查阅学习. 代码如下: < ...

  4. 连接RDS数据库

  5. JS完美运动框架【利用了Json】

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  6. JS规则 表达出你的想法(表达式) 通常包括常数和变量 var num2 = num1+6;

    表达出你的想法(表达式) 表达式与数学中的定义相似,表达式是指具有一定的值.用操作符把常数和变量连接起来的代数式.一个表达式可以包含常数或变量. 我们先看看下面的JavaScript语句: 生活中&q ...

  7. bat删除多少天前的文件包含子目录

    通过 Forfiles 删除指定目录下过期的备份文件 /*-- 用法详解 D:/>forfiles /? FORFILES [/P pathname] [/M searchmask] [/S] ...

  8. CodeForces - 27E

    https://vjudge.net/problem/CodeForces-27E 求因子个数为n的最小的数dfs枚举质因子的幂 #include <iostream> #include ...

  9. JZOJ[3771] 【NOI2015模拟8.15】小 Z 的烦恼

    题目 描述 题目大意 有从111到nnn的数字,每个数字都可以放在一个盒子里(可以不放).一旦放,满足: 如果它不在第mmm个盒子,那么它的两倍一定在后面一个盒子里. 如果它不在第111个盒子,那么它 ...

  10. 廖雪峰Java14Java操作XML和JSON-2JSON-2处理JSON

    解析JSON JSR 353 API 常用的第三方库 * Jackson * gson * fastjson Jackson: 提供了读写JSON的API JSON和JavaBean可以互相转换 可食 ...