MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

번역 작업 진행중입니다.

HTMLCollection 인터페이스는 (document order의) 요소들(elements)의 일반적인 콜렉션을 나타낸다. (arguments처럼 유사 배열의 형태이다.) 리스트(list)에서 선택하기 위한 메소드(method)와 속성(properties)들을 제공한다.

Note: 이 인터페이스는 역사적인 이유로 HTMLCollection이라고 불리게 되었다. (모던 DOM이전에, 이 인터페이스를 구현하는 콜렉션은 항목(item)으로 HTML 요소만 가질 수 있었다.).

HTML DOM의 HTMLCollection은 실시간 버전이다. 도큐먼트(documents)가 변경되면 자동으로 업데이트된다. 

속성(Properties)

HTMLCollection.length Read only
컬렉션 항목의 갯수를 반환한다.

메서드(Methods)

HTMLCollection.item()
0부터 시작하는 index의 특정 노드를 리스트에 반환(return)한다. 인덱스의 범위에서 벗어나면 (범위를 초과하면) null을 반환한다.
HTMLCollection.namedItem()
대체 노드(fallback)로서 ID 또는 이름이 name에 지정된 문자열과 일치하는 특정 노드를 반환한다. 이름으로 일치하는 것은 최후의 수단으로, 오로지 참조된 요소가 name 속성을 지원하는 경우에만 수행된다. 지정된 이름의 노드가 존재하지 않는 경우엔 null을 반환한다.

자바스크립트 용법

HTMLCollection은 또한 멤버를 이름과 인덱스로 속성을 직접 노출한다. HTML ID는 유효한 문자로 : . 을 포함할 수 있는데, 속성에 접근하기 위해서는 대괄호 표기법을 사용해야 한다. 현재 HTMLCollections은 순수 숫자로 된 ID를 인식하지 못한다. HTML5에서 허용하기는 하지만, 배열 형식(array-style)의 접근(access)과 충돌할 수 있기 때문이다.

예를 들어, 도큐먼트(document)에 "myForm"라는 id를 가진 <form>요소 하나가 있다고 가정해보자.

var elem1, elem2;

// document.forms은 HTMLCollection이다.

elem1 = document.forms[0];
elem2 = document.forms.item(0);

alert(elem1 === elem2); // "true"

elem1 = document.forms.myForm;
elem2 = document.forms.namedItem("myForm");

alert(elem1 === elem2); // "true"

elem1 = document.forms["named.item.with.periods"];

브라우저 호환성

인덱스(index)(또는 namedItem's의 인수(argument))로 사용된 문자열과 일치하는 요소가 둘 이상일 때 브라우저들은 각각 다르게 동작한다. 파이어폭스 8 DOM 2와 DOM4에서 명세한대로, 첫 번째로 일치하는 요소를 반환한다.  같은 경우에, 웹킷(Webkit) 브라우저와 인터넷 익스플로러는  또다른 HTMLCollection을 반환한다. 오페라(Opera) 브라우저는 일치하는 모든 요소의 NodeList를 반환한다.

명세서

Specification Status Comment
DOM
The definition of 'HTMLCollection' in that specification.
Living Standard  
Document Object Model (DOM) Level 2 HTML Specification
The definition of 'HTMLCollection' in that specification.
Obsolete  
Document Object Model (DOM) Level 1 Specification
The definition of 'HTMLCollection' in that specification.
Obsolete Initial definition.

See also

문서 태그 및 공헌자

 이 페이지의 공헌자: huusz
 최종 변경: huusz,