이 페이지 에서 다음 설명 이 제공됩니다 .
getElementsByClassName () 메소드는 지정된 클래스 이름을 가진 문서의 모든 요소 콜렉션을 NodeList 오브젝트로 리턴합니다.
NodeList 오브젝트는 노드 콜렉션을 나타냅니다. 노드는 색인 번호로 액세스 할 수 있습니다. 인덱스는 0에서 시작합니다.
팁 : NodeList 객체의 length 속성을 사용하여 지정된 클래스 이름을 가진 요소 수를 결정한 다음 모든 요소를 반복하고 원하는 정보를 추출 할 수 있습니다.
따라서 매개 변수 getElementsByClassName
로 클래스 이름을 사용할 수 있습니다.
이것이 HTML 본문 인 경우 :
<div id="first" class="menuItem"></div>
<div id="second" class="menuItem"></div>
<div id="third" class="menuItem"></div>
<div id="footer"></div>
그런 다음 주어진 클래스 이름과 일치하므로 var menuItems = document.getElementsByClassName('menuItem')
3 개의 상위 컬렉션 (배열이 아닌)을 반환합니다 <div>
.
그런 다음 다음을 사용하여이 노드 ( <div>
이 경우 s) 콜렉션 을 반복 할 수 있습니다 .
for (var menuItemIndex = 0 ; menuItems.length ; menuItemIndex ++) {
var currentMenuItem = menuItems[menuItemIndex];
// do stuff with currentMenuItem as a node.
}
요소와 노드의 차이점에 대한 자세한 내용은 이 게시물 을 참조하십시오 .
getElementsByClassName()
복수를getElementById()
의미하는 반면 단수의 요소를 의미한다.