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 ...
随机推荐
- 洛谷P3167 通配符匹配 [CQOI2014] 字符串
正解:哈希+dp/AC自动机/kmp 解题报告: 传送门! 这题解法挺多的,所以就分别港下好了QwQ 首先港下hash+dp趴 可以考虑设dp式f[i][j]:匹配到第i个通配符了,下面那个字符串匹配 ...
- ELK基础原理
搜索引擎 索引组件: 获取数据-->建立文档-->文档分析-->文档索引(倒排索引) 搜索组件: 用户搜索接口-->建立查询(将用户键入的信息转换为可处理的查询对象) ...
- ubuntu 使用dpkg手动安装deb包时发生循环依赖的解决办法
将循环依赖的所有包放到同一个命令行里一起安装,如: sudo dpkg -i libnss3-nssdb_3.28.4-0ubuntu0.14.04.4_all.deb libnss3_3.28.4- ...
- chrome下调试安卓app 之 ionic
打开chrome浏览器,输入chrome://inspect/#devices,将安卓手机插入电脑上,打开手机设置 打开 开发者调试usb调试 ,网页上会出现 input 点击, 就会看见consol ...
- 使用 Asp.net core 2.0 + Angular 4 构建车辆管理的Web应用程序
https://www.codeproject.com/Articles/1210559/Asp-net-core-Angular-Build-from-scratch-a-web
- sql server 按年月日分组
sql server 按年月日分组 ----------------------------------------------- --author:yangjinwang --date:2017- ...
- Linux上不了网的几个排查点
下面是所有系统通用排查流程: 1.先ping网关: 例ping 192.168.12.1: 如果能通说明本地IP配置和本地到路由器的链路未发生问题. 如果不通需要检查本地设置和本地到路由的网线连接状态 ...
- MariaDB glare cluster简介
MariaDB MariaDB 是由原来 MySQL 的作者Michael Widenius创办的公司所开发的免费开源的数据库服务器,MariaDB是同一MySQL版本的二进制替代品, 当前最新版本1 ...
- 51Nod 1058 N的阶乘的长度
输入N求N的阶乘的10进制表示的长度.例如6! = 720,长度为3. Input 输入N(1 <= N <= 10^6) Output 输出N的阶乘的长度 Input示例 6 Out ...
- php 根据日期获取星座
根据日期获取星座 /* * * 获取星座 * 星座是按阳历来计算的 * $month 阳历月份 * $day 阳历日期 * */ public static function get_xingzuo( ...