[JavaScript] DOM(Document Object Model)이란?
1. DOM 정의
DOM(Document Object Model, 문서 객체 모델)은 HTML 문서를 위한 ‘프로그래밍 인터페이스’이다.
프로그래밍 인터페이스란 여러 소프트웨어 간의 ‘상호작용’을 가능하게 해주는 표면같은 것이다.
2. DOM 기능
DOM은 웹페이지의 화면을 조작할 수 있다.
여기서 화면을 조작한다는 것은 HTML 문서를 수정하는 것이 아니다.
HTML은 화면을 만들기 위한 최초의 설계도이고, 브라우저가 그 설계도를 이용해 화면을 구성한다.
DOM 인터페이스는 그 화면에 접근하고 특정 부분을 조작한다.
3. DOM 자료 구조
DOM은 ‘트리 구조’를 가지고 있다.
트리 구조를 쉽게 설명하자면 회사의 조직도처럼 최상위 계층부터 하위로 세분화되어가는 구조를 뜻한다.
트리 구조의 각 요소는 ‘Node’라고 부른다.
아래에 HTML 문서와 그를 기반으로 한 DOM의 자료 구조를 살펴보자.
<!DOCTYPE html>
<html>
<head>
<title>DOM Structure</title>
</head>
<body>
<h1>What structure does DOM have?</h1>
<p>DOM has Tree Structure</p>
</body>
</html>
Leave a comment