DOM이란?

문서 객체모델(The Document Object Model)은 HTML, XML문서의 프로그래밍 interface이다.

DOM은 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여
그들이 문서 구조, 스타일, 내용등을 변경할 수 있게 돕는다.
DOM은 nodes와 object로 문서를 표현하고, 이것들이 웹 페이지를 스크립트 또는 프로그래밍
언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다.

DOM은 HTML 문서의 요소를 제어하기 위해 웹 브라우저에서 처음 지원되었다. DOM은 동적으로 문서의 내용, 구조, 스타일에 접근하고 변경하는 수단이었다. 브라우저 사이에 DOM 구현이 호환되지 않음에 따라, W3C에서 DOM 표준 규격을 작성하게 되었다.

DOM은 문서의 기반이 되는 데이터 구조에 제한을 두지 않는다. 잘 구조화된 문서는 DOM을 사용하여 트리 구조를 얻어낼 수 있다. 대부분의 XML 해석기와 XSL 처리기는 트리 구조의 이용에 대응해 개발되었다. 이 같은 구현에서는 문서의 전체 내용이 해석되어 메모리 저장되어야 한다. 때문에 DOM은 문서 요소가 임의적으로 접근되고 변경할 수 있어야 하는 응용 프로그램에 가장 적합하다.

웹 페이지는 일종의 문서이고, 이 문서는 웹 브라우저를 통해서 내용이 해석되어
웹 브라우저 화면에 나타나거나 HTML 소스 자체로 나타나기도 한다.
동일한 문서를 사용하여 이처럼 다른 형태로 나타낼 수 있다는 점에 주목할 필요가 있는데
DOM은 동일한 문서를 표현하고, 저장하고, 조작하는 방법을 제공한다.
DOM은 웹 페이지의 객체 지향 표현이며, 자바스크립트와 같은 스크립팅 언어를 이용해
DOM을 수정할 수 있다.

W3C DOM, WHATWG DOM 표준은 대부분의 브라우저에서 DOM을 구현하는 기준이고,
많은 브라우저들이 표준 규약 기능 외에도 추가적인 기능들을 제공하기 때문에
사용자가 작성한 문서들이 각기 다른 DOM이 적용된 다양한 브라우저 환경에서 동작할 수 있다는
사실을 항상 인지해야 한다.

웹 페이지를 수정하거나 생성하는데 사용되는 모든 property, method, event들은 objects로
구성된다.

DOM과 자바스크립트

DOM은 프로그래밍 언어는 아니지만 DOM이 없다면 자바스크립트 언어는 웹 페이지 또는
XML 페이지 및 요소들과 관련된 모델이나 개념들에 대한 정보를 갖지 못한다.
문서의 모든 element 안의 text는 문서를 위한 DOM의 한 부분이다.
이러한 요소들을 DOM과 자바스크립트와 같은 스크립팅 언어를 통해 접근하고 조작할 수 있는 것이다.

초창기에는 자바스크립트와 DOM이 밀접하게 연결되어 있었지만, 나중에는 각각 분리되어 발전되어 왔다.
페이지 콘텐츠는 DOM에 저장되고 자바스크립트를 통해 접근하거나 조작할 수 있다.

API(web or XML page) = DOM + JS(scripting language)

DOM에 어떻게 접근할 수 있는가?

DOM을 사용하기 위해 특별히 해야할 일은 없다. 각각의 브라우저가 자신만의 방법으로
DOM을 구현하였다. 모든 웹 브라우저는 스크립트가 접근할 수 있는 웹 페이지를 만들기 위해
어느 정도의 DOM을 항상 사용한다.

참고
https://developer.mozilla.org/ko/docs/Web/API/Document_Object_Model/Introduction
https://ko.wikipedia.org/wiki/%EB%AC%B8%EC%84%9C_%EA%B0%9D%EC%B2%B4_%EB%AA%A8%EB%8D%B8