​x
 
<!DOCTYPE html>
<html>
<style>
.example {
  border: 1px solid black;
  margin: 5px;
}
</style>
<body>
​
<h1>Document 对象</h1>
​
<h2>querySelectorAll() 方法</h2>
​
<p>更改 class="example" 的所有元素的背景色：</p>
​
<div class="example">
class="example" 的 div
</div>
​
<div class="example">
class="example" 的 div
</div>
​
<p class="example">这是 class="example" 的 p 元素。</p>
​
<p>这是另一个 p 元素中的 class="example" 的 <span class="example">span</span> 元素。</p>
​
​
<script>
const nodeList = document.querySelectorAll(".example");
for (i = 0; i < nodeList.length; i++) {
  nodeList[i].style.backgroundColor = "red";
}
</script>
​
</body>
</html>
​