querySelectorAll()方法
querySelectorAll()方法
调用的对象包括：Document（文档） DocumentFragment（文档片段） Element（元素）
querySelectorAll()方法接收的参数与querySelector()方法一样，也是一个css选择符，但返回的是所有匹配的元素，这个方法返回的是一个NodeList实例
返回的值是带有所有属性和方法的NodeList，而其底层实现则类似与一组元素快照，但是这个NodeList并不是动态的而是一个快照。
如果没有找到则会返回一个空的NodeList对象
要取得返回的NodeList中的每一个元素，可以使用item()方法
item方法是类数组的方法或者使用方括号语法
<body>
<p index='klkx'>456</p>
<a index='klkx' class='p1' id='p2'>123</a>
<div index='klkx' class='p1' id='p2'>789</div>
<script>
var s1 = document.querySelector('p[index]');
var s2 = document.querySelector('a.p1');//ID选择var s2 document.querySelector('div#p2');
var divs = document.querySelectorAll('div[index]'),
i,
len=divs.length;//
s1.style.color = 'red';
s2.style.color = 'yellow';
for (i=0;i<len;i++ )
{
divs[i].className = 'important';//divs.item(i).className = 'important';
}
</script>
</body>
querySelectorAll()方法的更多相关文章
- querySelectorAll 方法相比 getElementsBy 系列方法区别
最近有人问到querySelectorAll 方法相比 getElementsBy 系列方法区别,一时没想起来说些什么,今天查下文档,总结一下它们的区别,以便自己理解. 1. W3C 标准queryS ...
- 如何循环遍历document.querySelectorAll()方法返回的结果
使用JavaScript的forEach方法,我们可以轻松的循环一个数组,但如果你认为document.querySelectorAll()方法返回的应该是个数组,而使用forEach循环它: /* ...
- querySelectorAll 方法相比 getElementsBy 系列方法有什么区别
感谢 http://www.zhihu.com/question/24702250 简生 的回答 1. W3C 标准 querySelectorAll 属于 W3C 中的 Selectors API ...
- [label][转载][JavaSript]querySelectorAll 方法相比 getElementsBy 系列方法有什么区别？
轉載出處: http://www.zhihu.com/question/24702250 querySelectorAll 相比下面这些方法有什么区别? getElementsByTagName g ...
- document.querySelector和querySelectorAll方法
querySelector和querySelectorAll是W3C提供的新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null. 2.q ...
- querySelector和querySelectorAll方法介绍
module dom { [Supplemental, NoInterfaceObject] interface NodeSelector { Element querySelector(in DOM ...
- javascript之 原生document.querySelector和querySelectorAll方法
querySelector和querySelectorAll是W3C提供的新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null. 2.q ...
- IE6、IE7兼容querySelectorAll和querySelector方法-最终版本
querySelector 和 querySelectorAll 方法是 W3C Selectors API 规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素.目前几乎主流浏 ...
- querySelectorAll 方法和 getElementsBy 系列方法的区别
本文是我在知乎上的一个回答:http://www.zhihu.com/question/24702250/answer/28695133 ————— 下面是正文 ————— 1. W3C 标准quer ...
随机推荐
- ubuntu下安装mysql及常用操作
1.可通过ps -ef | grep mysql命令查看系统中是否有安装mysql 如果出现类似上述的页面,就证明是已经安装过了mysql,否则就是没有. 2.安装mysql 很简单,只需要键入如下命 ...
- 如何开发简单的javaweb项目，jsp+javabean+servlet
一.相关的软件下载和环境配置 1.下载并配置JDK. 2.下载eclipse. 3.下载并配置apache-tomcat(服务器). 4.下载MySQL(数据库). 5.下载Navicat for M ...
- swift - label字体 倾斜，加粗
/* label.font = [UIFont fontWithName:@"Helvetica-Bold" size:20];//加粗 label.font = [UIFont ...
- JDK1.5 Excutor 与ThreadFactory
Excutor 源码解读: /** * An object that executes submitted {@link Runnable} tasks. This * interface provi ...
- 关于界面绘制过程多次回调ondraw()方法产生的问题
最近项目中,出现一个问题,要做成的效果是这样的,但是一进去就变成这样了, 后来发现,刚进去是正常的,一闪而过,就变成全部了. 界面绘制过程,ondraw() 会被多次回调. 就是说在第一次绘制的时候是 ...
- idea中lombok安装
项目中经常使用bean,entity等类,绝大部分数据类类中都需要get.set.toString.equals和hashCode方法,虽然eclipse和idea开发环境下都有自动生成的快捷方式,但 ...
- js全局作用域
全局作用域 不在任何函数内定义的变量就具有全局作用域.实际上,JavaScript默认有一个全局对象window,全局作用域的变量实际上被绑定到window的一个属性: var course = 'L ...
- （转）Eclipse导入EPF配置文件
为了美化Eclipse大家可以从 http://www.eclipsecolorthemes.org/ 下载EPF配置文件,使用方法如下 (1)从File菜单 选择Import (2) 选择Gen ...
- 引爆你的Javascript代码进化
转自:http://www.hicss.net/evolve-your-javascript-code/ 方才在程序里看到一段JS代码,写法极为高明,私心想着若是其按照规范来写,定可培养对这门语言的理 ...
- 【已处理完】Centos 6.5版本，df -h出来的容量与du -sh的容量不对应是怎么会事呢？
问题如题,df -h 出来的容量与du -sh 查看的容量信息不一样,是那里出了问题了吗? 下面分别是du -sh *与df -h出来的结果 [root@mail /]# du -sh * 6.2M ...