더 "Try it Yourself" 아래의 예.
정의 및 사용
childNodes에 속성은 NodeList를 객체로, 노드의 자식 노드의 컬렉션을 반환합니다.
그들은 소스 코드에 나타나는 인덱스 번호로 액세스 할 수있는 컬렉션의 노드는 분류되어 있습니다. 인덱스는 0에서 시작한다.
참고 : 요소 내부의 공백은 텍스트로 간주되며, 텍스트 노드로 간주됩니다. 댓글은 노드로 간주됩니다.
팁 : 사용할 수있는 길이 다음 모든 자식 노드를 통해 반복하고 원하는 정보를 추출 할 수 있습니다, 자식 노드의 수를 결정하는 노드 목록 개체의 속성을.
이 속성은 읽기 전용입니다.
팁 : 노드의 요소 노드의 컬렉션을 반환하려면 (excluding text and comment nodes) , 사용 어린이 속성을.
팁 : 소자 .childNodes [0]와 같은 결과를 생성 할 것이다 firstChild 속성.
브라우저 지원
재산 | |||||
---|---|---|---|---|---|
childNodes | 예 | 예 | 예 | 예 | 예 |
통사론
element .childNodes
기술적 세부 사항
반환 값 : | 노드의 컬렉션을 나타내는있는 NodeList 객체. 그들은 소스 코드에 나타나는 반환 된 컬렉션의 노드는 분류되어 있습니다 |
---|---|
DOM 버전 | 코어 레벨 1 요소 개체 |
더 예
예
많은 아이가 노드 방법을 알아보십시오 <div> 요소가있다 :
var c =
document.getElementById("myDIV").childNodes.length;
C의 결과는 다음과 같습니다
5
»그것을 자신을 시도 예
두 번째 자 노드의 배경색을 변경 (index 1) (A)의 <div> 요소 :
var c = document.getElementById("myDIV").childNodes;
c[1].style.backgroundColor = "yellow";
»그것을 자신을 시도 예
세 번째 자식 노드의 텍스트를 가져옵니다 (index 2) (A)의 <select> 요소 :
var c = document.getElementById("mySelect").childNodes[2].text;
C의 결과는 다음과 같습니다
Saab
»그것을 자신을 시도 관련 페이지
HTML DOM 참조 : 노드입니다. firstChild 속성
HTML DOM 참조 : 노드입니다. lastChild 속성
HTML DOM 참조 : 노드입니다. 인 parentNode 속성
HTML DOM 참조 : 노드입니다. 로 nextSibling 속성
HTML DOM 참조 : 노드입니다. previousSibling은 속성
HTML DOM 참조 : 노드입니다. 여기서 nodeName 속성