getElementsByClassName 메서드

getElementsByClassName 메서드는 class 속성에 지정된 클래스를 기반으로 페이지 요소를 가져올 수 있게 해줍니다. 가져온 요소로는 다양한 조작을 할 수 있습니다: 텍스트, 속성, CSS 스타일 등을 변경하는 등입니다.

구문

javascriptdocument.getElementsByClassName(클래스 이름);

예시

클래스 www를 가진 모든 요소를 가져와 innerHTML 속성을 사용하여 텍스트를 변경해 봅시다:

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

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

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

코드 실행 결과:

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

같이 보기