그림출처:The Document Object Model
null
이란 존재하지 않음을 의미 = 해당 노드가 없음html
: document.documentElement
body
: document.body
head
: document.head
// <body>의 부모 노드는 <html>입니다
alert( document.body.parentNode === document.documentElement ); // true
// <head>의 다음 형제 노드는 <body>입니다.
alert( document.head.nextSibling ); // HTMLBodyElement
// <body>의 이전 형제 노드는 <head>입니다.
alert( document.body.previousSibling ); // HTMLHeadElement
firstChild
와 lastChild
속성을 이용하여 첫번째 또는 마지막 자식 노드에 빠르게 접근 가능 = 단축키 같은 역할
element.hasChildNodes()
로 존재 여부 검사 가능
childNodes
는 컬렉션(유사배열객체)로 for...of
를 사용할 수 있다.
for (let node of document.body.childNodes) {
document.write(node); // 컬렉션 내의 모든 노드를 보여줍니다.
}
그외 참조