1. DOM 요소 컬렉션
ㅇ 유사 배열 객체 형태(타입)으로써,
- 대부분, 그 결과 내용이 실시간적으로 DOM 트리를 반영함
ㅇ 종류 : HTMLCollection, NodeList, classList, childNodes
- HTMLCollection, NodeList은, 특정 DOM 노드들의 선택 접근시 반환됨 ☞ DOM 노드 접근 참조
2. HTMLCollection
ㅇ 실시간 반영(항상 현재를 반영)하는, 여러 HTML 구성 요소들을 담고있는 컬렉션 자료 형식
ㅇ getElementsByTagName(),getElementsByClassName() 같은 메소드에 의해 반환되는 노드들의 컬렉션
ㅇ 주요 멤버
- length : 담고있는 요소 수
- item(i) : i번째 요소
- namedItem(name 또는 id) : 주어진 id 또는 name 속성 이름이 같은 요소
3. NodeList ☞ MDN NodeList 참조
ㅇ 유사 배열 객체 이면서, 이터러블 임
ㅇ 접근 가능한 노드 컬렉션
- 개별 아이템은 인덱스에 의해 접근 가능
ㅇ querySelectorAll()와 같은 메소드에 의해, 반환되는 노드들의 컬렉션
ㅇ 실시간 미 반영
- childNodes 프로퍼티의 반환 결과와 달리, 실시간 반영 않고, 지난 과거의 노드들의 컬렉션임
ㅇ 주요 멤버
- 프로퍼티 : length
- 메소드 (NodeList.prototype) : item(i), forEach(), entries(), keys(), values()
4. classList 프로퍼티 ☞ MDN ClassList 참조
ㅇ 실시간 반영(항상 현재를 반영)하는, class 이름 관리를 위한 컬렉션 유형
ㅇ 이를통해, DOMTokenList 인터페이스 형태로, class 속성값(공백 구분된 문자열)들을 취득 가능
* DOMTokenList 인터페이스는, ☞ MDN DOMTokenList 참조
. 공백으로 구분 된 문자열로 표현된 정렬된 문자열 토큰 집합을 말함
. 주요 멤버
.. length : 토큰 수
.. item(i) : i번째 토큰을 취득
.. contains(문자열) : 지정한 문자열(토큰)을 포함하고 있는가 여부
.. add(문자열) : 지정한 문자열(토큰) 추가
.. remove(문자열) : 지정한 문자열(토큰) 제거
.. toggle(문자열) : 지정한 문자열(토큰)이, 없으면 추가, 있으면 제거
5. childNodes 프로퍼티 : 자식 노드 리스트 프로퍼티
ㅇ 실시간 반영(항상 현재를 반영)하는, 살아있는, 자식 노드 정보 리스트
ㅇ 모든 직계 자식 노드들을 가리키는 유사 배열 객체
ㅇ 읽기 전용