HTML5中类jQuery选择器querySelector和querySelectorAll的使用
支持的浏览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的使用的更多相关文章
- HTML5中类jQuery选择器querySelector的高级使用 document.querySelectorAll.bind(document);
基本用法 querySelector 该方法返回满足条件的单个元素.按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找,返回第一个满足条件的元素. ----> querySe ...
- HTML5中类jQuery选择器querySelector的使用
简介 HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的 ...
- javascript选择器querySelector和querySelectorAll的使用和区别
querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...
- js高级选择器querySelector和querySelectorAll
querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...
- 重要选择器querySelector和querySelectorAll
他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏览器均支持了他们.包括 IE8(含) 以上版本. Firefox. Chrome.Safari.Opera. queryS ...
- 高级选择器querySelector和querySelectorAll
Javascript新提供的querySelector和querySelectorAll方法,是仿照CSS选择器功能编写的 querySelector 功能:该方法返回满足条件的单个元素.按照深度优先 ...
- 强大的原生DOM选择器querySelector和querySelectorAll
在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...
- 原生JS强大DOM选择器querySelector与querySelectorAll
在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...
- javascript高级选择器querySelector和querySelectorAll
querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...
随机推荐
- day 54 Django基础四之模板系统
Django基础四之模板系统 本节目录 一 语法 二 变量 三 过滤器 四 标签Tags 五 模板继承 六 组件 七 自定义标签和过滤器 八 静态文件相关 一 语法 模板渲染的官方文档 关于模 ...
- springcloud系列14 bus的使用
首先springcloud_bus原理: (1)完整流程:发送端(endpoint)构造事件event,将其publish到context上下文中(spring cloud bus有一个父上下文,bo ...
- Bootstrap——设置Tab标签切换
最近一个小项目需要用Tab标签切换显示不同div内容,用到了Bootstrap里面的东西,但是在Bootstrap3教程里却没有找到对应的代码,这里记录一下,方便以后快速查阅学习. 代码如下: < ...
- 连接RDS数据库
- JS完美运动框架【利用了Json】
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- JS规则 表达出你的想法(表达式) 通常包括常数和变量 var num2 = num1+6;
表达出你的想法(表达式) 表达式与数学中的定义相似,表达式是指具有一定的值.用操作符把常数和变量连接起来的代数式.一个表达式可以包含常数或变量. 我们先看看下面的JavaScript语句: 生活中&q ...
- bat删除多少天前的文件包含子目录
通过 Forfiles 删除指定目录下过期的备份文件 /*-- 用法详解 D:/>forfiles /? FORFILES [/P pathname] [/M searchmask] [/S] ...
- CodeForces - 27E
https://vjudge.net/problem/CodeForces-27E 求因子个数为n的最小的数dfs枚举质因子的幂 #include <iostream> #include ...
- JZOJ[3771] 【NOI2015模拟8.15】小 Z 的烦恼
题目 描述 题目大意 有从111到nnn的数字,每个数字都可以放在一个盒子里(可以不放).一旦放,满足: 如果它不在第mmm个盒子,那么它的两倍一定在后面一个盒子里. 如果它不在第111个盒子,那么它 ...
- 廖雪峰Java14Java操作XML和JSON-2JSON-2处理JSON
解析JSON JSR 353 API 常用的第三方库 * Jackson * gson * fastjson Jackson: 提供了读写JSON的API JSON和JavaBean可以互相转换 可食 ...