querySelector() 方法
返回文档中匹配指定 CSS 选择器的一个元素。
虽然IE8中没有getElementsByClassName()但可以用querySelector()代替
注意: querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素,请使用 querySelectorAll() 方法替代。
querySelector
获取文档中 class="example" 的第一个元素:
document.querySelector(".example");
querySelectorAll
获取文档中所有 class="example" 的 <p> 元素, 并为匹配的第一个 <p> 元素 (索引为 0) 设置背景颜色:
var x=document.querySelectorAll("p.example");
x[0].style.backgroundColor='red';
设置文档中所有 class="example" 元素的背景颜色:
var x=document.querySelectorAll(".example");
for(var i=0;i<x.length;i++){
x[i].style.backgroundColor='red';
}
querySelector() 方法的更多相关文章
- getElementById和querySelector方法的区别
"querySelector 属于 W3C 中的 Selectors API 规范 .而 getElementsBy 系列则属于 W3C 的 DOM 规范" 1.区别 getXXX ...
- HTML DOM querySelector() 方法
Document 对象 实例 获取文档中 id="demo" 的元素: document.querySelector("#demo"); <!DOCTY ...
- Javascript实例教程:querySelector()方法接受一个CSS查询并返回匹配模式的第一个子孙元素,如果没有匹配的元素则返回null。
文章简介:querySelector()方法接受一个CSS查询并返回匹配模式的第一个子孙元素,如果没有匹配的元素则返回null. querySelector()方法接受一个CSS查询并返回匹配模式的第 ...
- IE6、IE7兼容querySelectorAll和querySelector方法-最终版本
querySelector 和 querySelectorAll 方法是 W3C Selectors API 规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素.目前几乎主流浏 ...
- IE6、IE7兼容querySelectorAll和querySelector方法
querySelector 和 querySelectorAll 方法是 W3C Selectors API 规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流 ...
- js之querySelector方法
querySelector()接受一个CSS选择符,返回匹配的第一个元素,反之则NULL. 如: var body = document.querySelector('body'); var mydi ...
- querySelector.. 方法相比 getElementsBy..
querySelectorAll 返回的是一个 Static Node List,而 getElementsBy 系列的返回的是一个 Live Node List. 看看下面这个经典的例子 [5]: ...
- querySelector和getElementById方法的区别
一.querySelector() 的定义 querySelector() 方法选择指定 CSS 选择器的第一个元素 querySelectorAll() 方法选择指定的所有元素 二.与 getEle ...
- 深入理解javascript选择器API系列第三篇——h5新增的3种selector方法
× 目录 [1]方法 [2]非实时 [3]缺陷 前面的话 尽管DOM作为API已经非常完善了,但是为了实现更多的功能,DOM仍然进行了扩展,其中一个重要的扩展就是对选择器API的扩展.人们对jQuer ...
随机推荐
- 最全的MonkeyRunner自动化测试从入门到精通(7)
jython-installer-2.5.3.jar安装步骤步骤一:Jython的安装比较简单,Jython的安装程序本身就是一个Java应用程序,因此,在安装之前,你必须具备Java运行的环境. 步 ...
- TP框架中分页类的使用
public function test(){ $m=M('Message'); import('ORG.Util.Page');// 导入分页类 $count = $m->count();// ...
- 初始Redis
一.NoSql数据库(Not Only Sql): 1.又称为非关系型数据库,主流的NoSql数据库有: Redis,Hbase,MongoDB 2.NoSql产生的背景: 1.1.数据库的高并发的读 ...
- docker+rabbitmq的安装
docker pull rabbitmq:management docker run -d -p : -p : -p : -p : -p : -v /data/rabbitmq-data/:/var/ ...
- enzyme design 整体流程及感想
想起什么来写什么吧. 整体流程(以Ceas2, TPP, G3P为例): 准备蛋白即配体参数文件: 设置CST文件: 准备protocol和flag文件: 运行enzyme_design: 结果处理. ...
- [ Python ] OpenGL
pyOpenGL Installation Package Version------------------- -------numpy 1.14.2 PyOpenGL 3.1.0 PyOpenGL ...
- JSONModel(I)
JSONModel使用简介 JSONModel 只需要将你的 model 类继承自 JSONModel ,而同时 model 中的属性名又恰巧可以和 JSON 数据中的 key 名字一样的话,那么非常 ...
- HTML基础教程
<!DOCTYPE html><html> <head> <title></title> </head> <body> ...
- write RE validation
正则表达式,又称规则表达式.(英语:Regular Expression,在代码中常简写为regex.regexp或RE),计算机科学的一个概念.正则表达式通常被用来检索.替换那些符合某个模式(规则) ...
- opencv学习之路(27)、轮廓查找与绘制(六)——外接圆、椭圆拟合、逼近多边形曲线、计算轮廓面积及长度、提取不规则轮廓
一.最小外接圆 #include "opencv2/opencv.hpp" #include<iostream> using namespace std; using ...