[JavaScript] 자바스크립트 DOM이란?

DOM은 'The Document Object Model'의 약자이며, 이것을 번역하면 '문서 객체 모델이다.

문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서에 접근하기 위한 일종의  프로그래밍 *인터페이스(interface)이다. 이 객체 모델은 문서 내의 모든 요소를 정의하고, 각각의 요소에 접근하는 방법을 제공한다.
- DOM은 웹문서의 구조와 내용이 담긴 객체를 데이터로 표현하는 방식이다.

 

인터페이스(interface)는 서로 다른 두 개의 시스템, 장치 사이에서 정보나 신호를 주고받는 경우의 접점이나 경계면이다. 즉, 사용자가 기기를 쉽게 동작시키는데 도움을 주는 시스템을 의미한다. 컴퓨팅에서는 컴퓨터 시스템끼리 정보를 교환하는 공유 경계면이라고 본다. 이러한 정보 교환은 소프트웨어, 컴퓨터 하드웨어, 주변기기, 사람 간에 이루어져 있으며, 서로 복합적으로 이루어질 수도 있다. 터치스크린과 같은 일부 컴퓨터 하드웨어 장치들은 인터페이스를 통해 데이터를 송수신할 수 있으며 마우스나 마이크로폰과 같은 장치들은 오직 시스템에 데이터를 전송만 하는 인터페이스를 제공한다. 

 

원래 컴퓨팅(computing)은 계산을 의미했고, 컴퓨터(computer)는 계산하는 사람이란 뜻이었다. (라틴어로compu)전기적 컴퓨터가 출현하면서 이를 사용하는 행위 또한 가리키게 되었고 (계산을 수행하는) 전기적 과정은 컴퓨터 하드웨어에서 수행되었다. 이 용어는 컴퓨터에서 실행하기 위한 프로그램을 제작하는 이론적 개념이 아니라, 컴퓨터 과학의 일부분으로써 수학적 계산을 수행(컴퓨팅)한다는 원래의 의미에도 대응한다. 또한 넓은 의미에서 컴퓨터 기술 자원을 개발 및 사용하는 모든 활동을 가리키기도 한다

 

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

 

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

 

DOM은 *W3C의 표준 객체 모델이며, 다음과 같이 계층 구조로 표현된다.

* W3C(영어: World Wide Web Consortium, 축약형은 영어: WWW 또는 W3)는 월드 와이드 웹을 위한 표준을 개발하고 장려하는 조직으로 팀 버너스 리를 중심으로 1994년 10월에 설립되었다. W3C는 회원기구, 정직원, 공공기관이 협력하여 웹 표준을 개발하는 국제 컨소시엄(공통의 목적을 위한 협회나 조합)이다.

 

출처 : 코딩의 시작, TCP School (http://www.tcpschool.com/javascript/js_dom_concept)

 

 

 

참고 1 : DOM 소개 - Web API | MDN (mozilla.org)

DOM 소개 - Web API | MDN

참고 2 : XML - 위키백과, 우리 모두의 백과사전 (wikipedia.org)

XML - 위키백과, 우리 모두의 백과사전

참고 3 : 인터페이스 (컴퓨팅) - 위키백과, 우리 모두의 백과사전 (wikipedia.org)

인터페이스 (컴퓨팅) - 위키백과, 우리 모두의 백과사전

참고 4 : 코딩의 시작, TCP School

코딩교육 티씨피스쿨

참고 5 : W3C - 위키백과, 우리 모두의 백과사전 (wikipedia.org)