(JS) 노드

노드(node)

• HTML DOM은 노드라고 불리는 계층적인 단위에 정보를 저장

노드 종류

• 문서노드: 문서 전체를 나타내는 노드
• 요소노드: HTML 요소는 요소노드, 속성노드를 가징 수 있음
• 속성노드: 속성은 모두 속성노드이며, 요소노드에 관한 정보를 가지고 있음
• 텍스트노드: 텍스트는 모두 텍스트노드
• 주석노드: 주석은 모두 주석노드

노드의 관계

• parentNode: 부모 노드
• children: 자식
• childNodes: 자식 노드 리스트
• firstChild: 첫번째 자식 노드 (요소, 텍스트, 주석도 선택하므로 주의!)
• firstElementChild: 첫번째 자식 요소 노드
• lastChild: 마지막 자식 노드 (요소, 텍스트, 주석도 선택하므로 주의!)
• nextSibling: 다음 형제 노드
• previousSibling: 이전 형제 노드

노드 추가

• appendChild(): 새로운 노드를 해당 노드의 자식 노드 리스트 맨 마지막에 추가
• insertBefore(): 새로운 노드를 특정 자식 노드 바로 앞에 추가
• insertData(): 새로운 노드를 텍스트 데이터로 추가

노드 생성

• createElemnet(): 새로운 요소 노드를 만듬
• createAttribute(): 새로운 속성 노드를 만듬
• createTextNode(): 새로운 텍스트 노드를 만듬

노드 제거

• removeChild(): 자식노드 리스트에서 특정 자식 노드를 제거. 노드가 제거되면 해당노드를 반환. 노드가 제거될 때 노드의 자식들도 다같이 제거
• removeAttribute(): 특정 속성 노드를 제거

노드 복제

• cloneNode(): 기존의 존재하는 노드와 동일한 노드를 생성하여 반환