JavaScript如何通过querySelectorAll()方法查找html元素

这篇文章主要介绍了JavaScript如何通过querySelectorAll()方法查找html元素的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇JavaScript如何通过querySelectorAll()方法查找html元素文章都会有所收获，下面我们一起来看看吧。

让客户满意是我们工作的目标，不断超越客户的期望值来自于我们对这个行业的热爱。我们立志把好的技术通过有效、简单的方式提供给客户，将通过不懈努力成为客户在信息化领域值得信任、有价值的长期合作伙伴，公司提供的服务项目有：空间域名、虚拟主机、营销软件、网站建设、分宜网站维护、网站推广。

querySelectorAll()方法的定义与用法

querySelectorAll() 方法返回文档中匹配指定 CSS 选择器的所有元素，返回 NodeList 对象。

NodeList 对象表示节点的集合。可以通过索引访问，索引值从 0 开始。

提示: 你可以使用 NodeList 对象的 length 属性来获取匹配选择器的元素属性，然后你可以遍历所有元素，从而获取你想要的信息。

语法为：

elementList = document.querySelectorAll(selectors);

elementList 是一个静态的 NodeList 类型的对象。

selectors 是一个由逗号连接的包含一个或多个 CSS 选择器的字符串。

其中的属性值CSS 选择器 String 必须。 指定一个或多个匹配 CSS 选择器的元素。可以通过 id, class, 类型, 属性, 属性值等作为选择器来获取元素。多个选择器使用逗号(,)分隔。

返回值：

一个 NodeList 对象，表示文档中匹配指定 CSS 选择器的所有元素。 NodeList 是一个静态的 NodeList 类型的对象。如果指定的选择器不合法，则抛出一个 SYNTAX_ERR 异常。

示例如下：

获取文档中所有的

元素， 并为匹配的第一个

元素 (索引为 0) 设置背景颜色:

这是一个 p 元素。
这也是一个 p 元素。
点击按钮为文档中第一个 p (索引为 0) 元素设置背景颜色。
点我
注意:Internet Explorer 8  及更早版本不支持 querySelectorAll() 方法。

输出结果：

获取文档中所有 class="example" 的

元素， 并为匹配的第一个

元素 (索引为 0) 设置背景颜色:

使用 class="example" 的标题
使用 class="example" 的段落
 
另外一个使用 class="example" 的段落
 
点击按钮为第一个 class="example" (索引为 0) 的 p 元素设置背景颜色。
点我
注意:Internet Explorer 8  及更早版本不支持 querySelectorAll() 方法。

输出结果：

关于“JavaScript如何通过querySelectorAll()方法查找html元素”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“JavaScript如何通过querySelectorAll()方法查找html元素”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注创新互联行业资讯频道。