DOM(Document Object Model)

자바스크립트에서 DOM을 이용하면 HTML문서의 요소를 액세스하고 변경할 수 있다.

​웹 페이지가 로딩될 때 브라우저는 웹 페이지의 모든 요소들을 객체로 생성하는데 이를 DOM라고 부른다. 브라우저는 DOM을 생성하고 그 안의 모든 요소를 tree의 형태로 구성한다.

​​DOM은 W3C표준으로 문서를 액세스 할 수 있는 표준방법을 제시하고 있다. 

 

 

만약 위와 같은 문서가 있다면 아래와 같은 tree객체를 생성한다.

​ 

 

DOM객체는 HTML의 모든 엘리먼트를 제어할 수 있으며 다음과 같은 일들을 처리할 수 있다.

- HTML페이지의 요소를 변경할 수 있다.

- HTML페이지안의 요소가 갖고 있는 속성을 변경할 수 있다.

- HTML페이지의 모든 CSS속성을 변경할 수 있다.

- HTML페이지의 모든 엘리먼트와 속성을 추가하거나 제거할 수 있다.

- HTML페이지안의 모든 엘리먼트에 이벤트를 추가할 수 있다.