DOM

DOM이란?

**DOM(Document Object Model)**은 문서 객체 모델로 구조화된 문서(XML, HTML)를 객체 형태로 표현하는 방식을 말한다.

DOM의 트리 구조

DOM은 자바스크립트 엔진이 HTML 코드를 해석한 결과이다. 각각의 태그가 자바스크립트의 node 객체로 변환된다.

• 노드: HTML DOM에서 정보를 저장하는 계층적 단위
• 노드 트리: 노드들의 집합으로, 노드 간의 관계를 트리 구조로 나타낸 것

<aside> 💡 자바스크립트 엔진이란?

자바스크립트 엔진은 일련의 과정을 거쳐서 컴퓨터에게 최적화된 코드로 변환하여 전달하게 되고, 이러한 과정으로 인해서 컴퓨터가 자바스크립트 파일을 이해하고 수행할 수 있다. 즉, 자바스크립트 엔진은 자바스크립트 코드를 마이크로프로세서가 이해할 수 있게 기계어로 변환해서 실행하는 프로그램 또는 인터프리터를 말한다. 대표적으로 Google V8 엔진이 있는데, Google Chrome과 Node.js에서 사용되고 있는 구글에서 제작한 자바스크립트 엔진이다.

</aside>

document, node 객체

document와 node 객체는 HTML 요소의 선택과 조작 / 생성 및 추가 / 이벤트 핸들러 추가와 같이 HTML 요소와 관련된 작업을 도와주는 다양한 메서드를 제공한다.

document 객체

웹 페이지를 의미한다. JavaScript에서 DOM에 접근하고자 할 때에는 document 객체를 사용해야 한다.

node 객체

element(요소)라고도 하는 node 객체는 해당 요소를 조작할 수 있는 수많은 프로퍼티와 메서드가 존재한다.