DOM(document object model) ?

  • 객체 지향 모델로써 구조화된 문서를 표현하는 형식이다. 
  • HTML문서의 요소들에 접근 가능하도록 되어있다.
  • DOM을 사용하면 데이터를 동적으로 화면에 접근하고 변경할 수 있어 접근성과 조작성을 부여할 수 있다.



HTML의 기본적인 구조를 다음과 같은 트리형태로 나타낼 수 있다.


(P는 저렇게 되는게 맞는건지...)


이런 구조를 가진 속성(노드)들에 접근하기 위하여 DOM API를 사용한다.

괄호안에 노드라고 적어놓았는데 노드는 COM 트리를 이루고 있는 가장 기초적인 단위로 최상위 노드를 시작으로 부모 노드와 자식 노드를 가질 수 있다.


DOM API 예제

<html> <head> </head> <body> <h1 id="id1">test</h1> </body> </html>

document.getElementById("id1").setAttribute("color", "#e2e2e2");

document = 현재 문서

getElementById() = 인자로 넣어준 값이 id인 객체를 반환한다.

setAttribute() = 속성을 변경한다.


참고자료


'Web > HTML,CSS' 카테고리의 다른 글

[HTML] html RFC 한글 번역  (0) 2013.08.20
[HTML] 한글 번역문 HTML 4.01  (0) 2013.08.20
[CSS] Opacity 투명도 조절하기  (0) 2013.08.09
[HTML] 특징, 구성요소, 기본구조  (0) 2013.06.26

+ Recent posts