querySelectorAll() 예제
<style> #hz { border: 1px solid black; } </style> <div id="hz"> <h2 class="sinbi">홈짱닷컴</h2> <p class="sinbi">Homzzang.com</p> </div> <button onclick="homzzang()">클릭</button> <script> function homzzang() { var x = document.getElementById("hz").querySelectorAll(".sinbi"); x[0].style.backgroundColor = "yellow"; } </script> 결과보기
<style>
#hz {
border: 1px solid black;
}
</style>
<div id="hz">
<h2 class="sinbi">홈짱닷컴</h2>
<p class="sinbi">Homzzang.com</p>
</div>
<button onclick="homzzang()">클릭</button>
<script>
function homzzang() {
var x = document.getElementById("hz").querySelectorAll(".sinbi");
x[0].style.backgroundColor = "yellow";
</script>
결과보기
※ node 색인번호는 0부터 시작.
※ x.length : 2
※ 지정선택자와 일치하는 모든자식요소 노드리스트객체 반환.