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 ...
随机推荐
- MAVEN_day02快速入门
一.MAVEN工程目录结构 二.怎么在Eclipse中集成M2E插件(工欲善其事必先利其器)有一些准备工作 1.修改自己下载的MAVEN 2.设置本地仓库 三.构建MAVEN工程 1.选择“MAVEN ...
- python线程、协程、I/O多路复用
目录: 并发多线程 协程 I/O多路复用(未完成,待续) 一.并发多线程 1.线程简述: 一条流水线的执行过程是一个线程,一条流水线必须属于一个车间,一个车间的运行过程就是一个进程(一个进程内至少一个 ...
- 十一、无事勿扰,有事通知(2)——KVO
概述 Key-Value-Observe,简称KVO,和上节介绍的Notification师出同门,主要目的都是为了实现观察者模式. 虽说是同门师兄弟,但是各自精通的技艺却是各不相同的. 不像Noti ...
- python数据结构-如何统计序列中元素的频度
如何统计序列中元素的频度 问题举例 如何找出随机序列[1, 5, 6, 5, 3, 2, 1, 0, 6, 1, 6]中出现频度最高的3个元素? 如何统计某篇英文文章中词频最高的5个单词? 将序列转换 ...
- Sysinternals Utilities
https://docs.microsoft.com/zh-cn/sysinternals/ Sysinternals 之前为Winternals公司提供的免费工具,Winternals原本是一间主力 ...
- 用python写多线程
import threading #首先导入threading 模块,这是使用多线程的前提 from time import ctime,sleep def music(func): ): print ...
- axios的基本概念及安装配置方法
ajax:异步请求,是一种无需再重新加载整个网页的情况下,能够更新部分网页的技术 axios:用于浏览器和node.js的基于promise的HTTP客户端 1.从浏览器制作XMLHttpReques ...
- kendo treeview checkbox初始化选中问题,没解决,暂时记录下
想做带有checkbox的tree,由于项目一直用kendo ui for mvc,感觉 牛逼的kendo肯定有tree.结果碰到了选中的问题. 无法根据后台传来的IsChecked字段来设置 tr ...
- AWS是怎么改写 MySQL的?
五倍吞吐量的提升,跨可用区的六副本,低于一分钟的宕机恢复,兼容 MySQL协议,这是 AWS 推出 Aurora 数据库时给出的数据. 这种量级的提升不可能是小修小补,大都是在架构上有了变革性的突破才 ...
- PHP 批量操作删除,支持单个删除
PHP 执行部分: <?php include('checkadmin.php'); header('Content-Type: text/html; charset=utf-8'); if( ...