childNodes 속성

childNodes 속성은 요소의 자식 노드들(태그, 주석, 텍스트 노드)의 유사 배열 을 담고 있습니다.

문법

javascriptelement.childNodes;

예제

요소의 모든 자식 노드를 가져와 그 내용을 화면에 출력해 봅시다:

html<div id="parent">텍스트<p>단락</p><!--주석--></div>

javascriptlet parent = document.querySelector('#parent');
let nodes = parent.childNodes;

for (let node of nodes) {
  console.log(node.textContent);
}

예제

첫 번째 노드의 내용을 출력해 봅시다:

html<div id="parent">텍스트<p>단락</p><!--주석--></div>

javascriptlet parent = document.querySelector('#parent');
console.log(parent.childNodes[0].textContent);

코드 실행 결과:

javascript'텍스트'

예제

2번 노드의 내용을 출력해 봅시다:

html<div id="parent">텍스트<p>단락</p><!--주석--></div>

javascriptlet parent = document.querySelector('#parent');
console.log(parent.childNodes[2].textContent);

코드 실행 결과:

javascript'주석'

함께 보기