Java script - 5 (2021.03.24) Node 객체

https://developer.mozilla.org/ko/docs/Web/API/Node

Node

여러 가지 DOM 타입들이 상속하는 인터페이스이며 그 다양한 타입들을 비슷하게 처리할 수 있게 한다. 예를 들어, 똑같은 메서드를 상속하거나 똑같은 방식으로 테스트를 할 수 있다

 

---

Node 속성

element.childNodes

주어진 노드의 자식 노드를 배열로 반환한다.  배열의 항목은 개체 

 

element.firstChild

첫 번째 자식 노드를 반환 

 

element.lastChild

마지막 자식 노드를 반환 

 

Node.nextSibling

 부모 노드의 childNodes 목록에서 지정된 노드 바로 다음에 있는 노드를 반환. 

지정된 노드가 해당 목록의 마지막 노드면 null 반환.  

 다음 형제 노드 반환. 

Node.previousSibling

부모노드의 childNodes 목록에서 지정된 노드 바로 전에 있는 노드를 반환.

지정된 노드가 해당 목록의 마지막 노드면 null 반환.  

 이전 형제 노드 반환. 

 

Node.parentNode

지정된 노드의 부모 노드를 반환 

---

Node 메쏘드

Node.appendChild()

 한 노드를 특정 부모 노드의 자식 노드 리스트 중 마지막 자식으로 붙인다.  이동한 자식 노드를 반환

 

예)부모노드.appendChild(자식으로 넣고 싶은 노드); 

 

만약 주어진 노드가 이미 문서에 존재하는 노드를 참조하고 있다면, 노드를 현재 위치에서 새로운 위치로 이동시킨다. (문서에 존재하는 노드를 다른 곳으로 붙이기 전에 부모 노드로부터 지워버릴 필요는 없다.)

한 노드가 문서상의 두 지점에 동시에 존재할 수 없다는 것을 의미

 

Node.removeChild()

부모 노드에서 자식 노드를 삭제한다. 삭제된 노드를 반환한다. 

 

예) 부모노드.removeChild(삭제하고 싶은 자식노드); 

 

 

---

MDN에 가면 엄청 많지만 지금 쓸만한 건 이 정도인 듯^^