querySelectorAll 메서드

querySelectorAll 메서드를 사용하면 임의의 CSS 셀렉터로 페이지 요소를 가져올 수 있습니다. 얻은 요소들로 다양한 작업을 수행할 수 있습니다: 텍스트, 속성, CSS 스타일 등을 변경하는 것 등이 가능합니다.

구문

javascriptdocument.querySelectorAll(셀렉터);

예시

클래스가 www인 모든 요소를 가져와 textContent 속성을 사용하여 텍스트를 변경해 보겠습니다:

html<p class="www">요소 1</p>
<p class="www">요소 2</p>
<p class="www">요소 3</p>

javascriptlet elems = document.querySelectorAll('.www');

for (let elem of elems) {
  elem.textContent = '!!!';
}

코드 실행 결과:

html<p class="www">!!!</p>
<p class="www">!!!</p>
<p class="www">!!!</p>

참고 항목