HTML | DOM querySelectorAll() 方法

HTML 中的querySelectorAll()方法用于返回与指定 CSS 选择器匹配的元素子元素的集合，作为静态 NodeList 对象。 NodeList 对象表示节点的集合。可以通过索引号访问节点。索引从 0 开始。
注意：如果我们想将 CSS 属性应用于与指定选择器匹配的所有子节点，那么我们可以遍历所有节点并应用该特定属性。
句法：

element.querySelectorAll(selectors)

选择器是必填字段。它指定一个或多个 CSS 选择器来匹配元素。这些选择器用于根据它们的 id、类、类型等选择 HTML 元素。
在多个选择器的情况下，逗号用于分隔每个选择器。
例子：

html

    
        DOM querySelectorAll() Method
        
            #geek {
              border: 1px solid black;
              margin: 5px;
            }
        
    
    
        GeeksforGeeks
        querySelectorAll() Method
        
             
This is paragraph 1.
 
             
This is paragraph 2.
 
        
        Try it
        
            function myFunction() {
                var x = document.getElementById("geek").querySelectorAll("p");
                var i;
                for (i = 0; i < x.length; i++) {
                x[i].style.backgroundColor = "green";
                x[i].style.color = "white";
                }
            }
        
    

输出：

点击按钮后：

支持的浏览器： querySelectorAll() 方法支持的浏览器如下：

• 苹果 Safari 3.2
• 谷歌浏览器 4.0
• 火狐 3.5
• 歌剧 10.0
• 浏览器 9.0