​x
 
<!DOCTYPE html>
<html>
<style>
div {
  border: 1px solid black;
  margin-bottom: 10px;
}
</style>
​
<body>
<h1>Document 对象</h1>
​
<h2>querySelectorAll() 方法</h2>
​
<p>更改父元素为 div 元素的每个 p 元素的背景颜色：</p>
​
<div>
  <h3>H3 元素</h3>
  <p>我是一个 p 元素，我的父元素是一个 div 元素。</p>
</div>
​
<div>
  <h3>H3 元素</h3>
  <p>我是一个 p 元素，我的父元素也是一个 div 元素。</p>
</div>
​
​
<script>
const nodeList = document.querySelectorAll("div > p");
for (let i = 0; i < nodeList.length; i++) {
  nodeList[i].style.backgroundColor = "red";
}
</script>
​
</body>
</html>
​