childNodes 속성

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

문법

element.childNodes;

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

<div id="parent">텍스트<p>단락</p></div>

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

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

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

<div id="parent">텍스트<p>단락</p></div>

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

코드 실행 결과:

'텍스트'

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

<div id="parent">텍스트<p>단락</p></div>

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

코드 실행 결과:

'주석'