node
node에는 element, text, comment 등 여러 항목이 포함되어 있다
부모 node
- parentNode : 부모 노드 중 모든 노드를 반환한다.
자식 node
- childNodes : 자식 노드 목록을 NodeList 형태로 반환한다.
- firstChild : 자식 노드 중, 첫 번째 자식 노드를 반환한다.
- lastChild : 자식 노드 중, 마지막 자식 노드를 반환한다.
형제 node
- previousSibling : 같은 레벨의 노드 중, 이전 노드를 반환한다.
- nextSibling : 같은 레벨의 노드 중, 다음 노드를 반환한다.
See the Pen node by pminsun (@pminsun) on CodePen.
element
element는 여러 node 타입 중 한 종류로 <p>, <div>, <a>와 같은 태그를 사용해서 작성된 노드이다.
부모 element
- parentElement : 부모 요소(element)를 반환한다.
자식 element
- children : 자식 요소(element) 목록을, ' HTMLCollection ' 형태로 반환한다.
- firstElementChild : 자식 요소, 첫 번째 자식 요소를 반환한다.
- lastElementChild : 자식 요소 중, 마지막 요소를 반환한다.
형제 element
- previousElementSibling**:** 같은 레벨의 요소 중, 이전 요소를 반환한다.
- nextElementSibling: 같은 레벨의 요소 중, 다음 요소를 반환한다.
See the Pen element by pminsun (@pminsun) on CodePen.
'Javascript' 카테고리의 다른 글
SSE (text/event-stream) 적용 (0) | 2024.09.01 |
---|---|
메모리누수 방지 (0) | 2024.08.29 |
HTML 태그(DOM) 접근하기 (0) | 2024.08.28 |
Promise.all() (0) | 2024.08.28 |
문서의 로딩되는 시점 이벤트 제어하기 (0) | 2024.08.27 |