Node 객체

소개

Node 객체는 DOM에서 시조와 같은 역할을 한다. 다시 말해서 모든 DOM 객체는 Node 객체를 상속 받는다. Node 객체의 위상을 그림으로 나타내면 아래와 같다. 

 

 

주로 사용하는 노드 객체는 다음과 같다.

• 문서 노드(Document) - 전체 문서를 가리키는 Document 객체
• 요소 노드(Element) - HTML 요소를 가리키는 객체
• 텍스트 노드(CharacterData) - 텍스트를 가리키는 객체

 

주요기능

Node 객체의 주요한 임무는 아래와 같다.

관계

엘리먼트는 서로 부모, 자식, 혹은 형제자매 관계로 연결되어 있다. 각각의 Node가 다른 Node와 연결된 정보를 보여주는 API를 통해서 문서를 프로그래밍적으로 탐색할 수 있다.

• Node.parentNode - 이 노드의 부모 노드를 참조한다.
• Node.childNodes - 이 노드의 자식 노드의 참조를 저장한 유사 배열 객체(NodeList)
• Node.firstChild - 이 노드의 첫번째 자식 노드
• Node.lastChild - 이 노드의 마지막 자식 노드
• Node.nextSibling - 이 노드의 다음 형제 노드
• Node.previousSibling - 이 노드의 이전 형제 노드
• Node.contains()
• Node.hasChildNodes()

노드의 종류

Node 객체는 모든 구성요소를 대표하는 객체이기 때문에 각각의 구성요소가 어떤 카테고리에 속하는 것인지를 알려주는 식별자를 제공한다. 

• Node.nodeType - 노드 유형을 뜻하는 숫자 ( 1: 요소 노드, 3: 텍스트 노드, 9: Document )
• Node.nodeName - 요소 노드는 대문자로 바뀐 요소 이름이 들어간다. 텍스트노드는 '#text'가 들어간다.

값

Node 객체의 값을 제공하는 API

• Node.nodeValue - 텍스트 노드의 텍스트 콘텐츠.
• Node.textContent

자식관리

Node 객체의 자식을 추가하는 방법에 대한 API

• Node.appendChild()
• Node.removeChild()