支持的浏览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. ssm下使用分页插件PageHelper进行分页

    1. 导入maven依赖: <dependency> <groupId>com.github.pagehelper</groupId> <artifactId ...

  2. LightOJ-1214-Large Division-大数取余

    Given two integers, a and b, you should check whether a is divisible by b or not. We know that an in ...

  3. niginx相关命令及代理配置

    安装 in mac https://www.cnblogs.com/meng1314-shuai/p/8335140.html Nginx相关命令 mac下启动: 通过brew 安装install 后 ...

  4. idea git 下载项目,解决冲突,提交代码

    git安装 1. 安装git工具上篇文章说过请参考 https://mp.weixin.qq.com/s/A8MkjYTXYSMVRlg25TWemQ idea下载coding代码 打开idea准备下 ...

  5. SpringBoot之集成通用Mapper

    第一种: 1.引入POM坐标,需要同时引入通用mapper和jpa <dependency> <groupId>tk.mybatis</groupId> <a ...

  6. NBIS指纹特征提取与匹配软件使用

    1. docker 创建虚拟centos 环境 2. docker 安装wget 工具 3.wget下载源代码 wget http://nigos.nist.gov:8080/nist/nbis/nb ...

  7. 【主席树】 [CQOI2015]任务查询系统

    模板题... 差分,然后用主席树维护时间点上的优先值和就好了 就是细节烦... #include<bits/stdc++.h> #define int long long #define ...

  8. android 遍历控件

    做个笔记 androuid 遍历一个 view 下面的子view // 保存 btnSaveRout.setOnClickListener(new OnClickListener() { @Overr ...

  9. LUOGU P1342 请柬(最短路)

    传送门 解题思路 又是一道语文题,弄清楚题意之后其实就能想出来了,从1跑一遍最短路,把$dis[n]$加入答案.在建个反图跑一遍最短路,把$dis[n]_$加入最短路就行了.第一遍是去的时候,第二遍是 ...

  10. iOS开发UITableView的动画cell

    1.动画cell 针对cell的动画,在Delegate中对cell的layer进行操作: 2.实现代码 #import "ViewController.h" #import &q ...