[JavaScript] DOM

웹브라우저는 HTML;문서를 해석하고, 화면을 통해 해석된 결과를 보여준다.

해석한 HTML코드를 화면을 통해 보여주는 과정을 '렌더링' 이라고 한다.

 

렌더링 과정

1. 문서파싱

 : 브라우저는 HTML코드를 해석   

2. DOM 트리구축

 : 요소들을 트리형태로 구조화해 표현하는 문서(객체)를 생성한다 (=DOM)

출처 : https://www.guru99.com/ko/how-to-use-dom-and-events-in-javascript.html

 

 

3. 브라우저는 DOM을 통해 화면에 웹콘텐츠들을 렌더링한다.

 

DOM 사용이유

HTML코드는 정적인 텍스트일 뿐이기 때문에 사용자와 동적인 상호작용이 어렵고,

DOM이 실질적으로 동적인 상호작용을 한다. (DOM동작을 위해선 자바스크립트 객체사용)

--> DOM은 자바스크립트를 사용해서 웹화면의 콘텐츠를 추가,수정,삭제하거나 이벤트를 처리할 수 있도록 프로그래밍 인터페이스 제공