支持的浏览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. Big Number HDU - 1212

    As we know, Big Number is always troublesome. But it's really important in our ACM. And today, your ...

  2. IE6/IE7尿性笔记 && avalon && director

    表单提交 [ie6] form默认特性(input回车以及点击type=submit的按钮会自动触发form submit),在ie6中,不能使button[submit],必须是input[subm ...

  3. spring mvc文件上传报错:Expected MultipartHttpServletRequest: is a MultipartResolver configured?

    报错原因:spring-mvc.xml 的配置文件中,配置文件上传id不为 “multipartResolver” 解决:id 改为 “multipartResolver”

  4. Python接口测试框架实战与自动化进阶✍✍✍

    Python接口测试框架实战与自动化进阶  整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的感受,单论单个知识点课程本身没问题,大家看 ...

  5. 使用Python实现不同目录下文件的拷贝

    目标:要实现将一台计算机的共享文件夹中的文件备份到另一台计算机,如果存在同名的文件只要文件的大小和最后修改时间一致,则不拷贝该文件 python版本:Python3.7.1 python脚本: fro ...

  6. spring的mvc对于页面日期格式进行传值到后台

    对于spring的mvc 日期格式从页面传入后台是个问题.string类型和整形都能友好传入.但是对于日期类型date却不能传入.回报403参数不对的错误. 看例子: @RequestMapping( ...

  7. linux centos 恢复 还原 备份 Snapper 快照说明

    为什么要使用Snapper快照? 我们可以想像以下场景: 1. 场景一:系统发生意外宕机,工程师无法快速定位问题,业务受到中断,客户十分不满意. 2. 场景二:项目会议上,就是否升级某软件到最新版本, ...

  8. Python基础笔记_变量类型

     下面是W3C学习笔记 , , ) :] ]) :]) :]) :-]) :-]) ]) :]) :]) ) , , ]) :]) :]) ) , , , ]) :]) :]) ) ] = , ])) ...

  9. csps模拟测试7273简单的操作小P的2048小P的单调数列小P的生成树

    题面:https://www.cnblogs.com/Juve/articles/11678564.html 简单的操作: 考场上sb了,没看出来 如果有奇环一定不能缩成一条链,判掉奇环后就是bfs最 ...

  10. HTML值改变事件

    1.动态拼接html[表格中,如bootstrap grid] return '<input type="text" name="bjce" onchan ...