DOM

🏹 DOM (Document Object Model)

HTML 문서에 작성된 내용을 트리 구조로 표현한 것

document : { 
   DOCTYPE : html,
   HTML : {
       HEAD : {
           TITLE : { TEXT : "문서 제목" },
           STYLE : {...},
           META : {...}
       } ,
       BODY : {
           H1 : { TEXT : "제목", ATTRIBUTE : "속성" },
           COMMNET : { TEXT : "주석 내용" },
           DIV : {...}
       }
   }
}

---

🏹 Node와 Element의 차이

• Node : 태그(요소 노드), 속성, 주석, 내용 등
• Element : Node의 하위 개념으로, 요소 노드(태그)만을 가리킴

---

🏹 Node 속성

프로퍼티	설명
parentNode	부모 노드 선택
childeNodes	자식 노드 리스트 선택
firstChild	첫 번째 자식 노드 선택
lastChild	마지막 자식 노드 선택
previousSibling	이전 형제 노드 선택
nextSibling	다음 형제 노드 선택

---

🏹 Element 속성

프로퍼티	설명
parentElement	부모 요소 선택
childeNodes	자식 요소 선택
firstElementChild	첫 번째 자식 요소 선택
lastElementChild	마지막 자식 요소 선택
previousElementSibling	이전 형제 요소 선택
nextElementSibling	다음 형제 요소 선택