Front-End/

문서 스크립팅

taehyun_kim 2017. 4. 27. 20:34

 클라이언트 자바스크립트의 주 역할은 정적인 HTML 문서를 동적으로 작용할 수 있게 해주는 것이다.
이렇게 웹 페이지의 내용을 제어하는 것이 주 역할이다. 

 Window객체에는 Document 객체를 참조하는 document 프로퍼티가 존재한다. 이 프로퍼티는 해당 창의 내용 정보를 가지고 있다.  즉, 문서 내용을 나타내고 조작하는 중요한 역할을 하는 객체이다. DOM API의 일부이다.( 이게 뭔 소리여?? )

  

DOM 개요


 Document Object Model, 즉 DOM은 HTML과 XML 문서의 내용을 조작할 수 있는  API이다. HTML의 요소 집합(태그) 들이 DOM에서는 객체의 계증 구조로 표현된다.




 HTML이 DOM 객체로 된 그림이다. 최상단에는 문서 전체를 나타내는 Document 객체가 있고, Element 노드와 Text 노드들이 있는걸 볼 수 있다.



 그럼 Document 객체는 누가 언제 만드는거임??

 브라우저에는 요청 받은 내용(html)을 화면에 표시해주는 렌더링 엔진이 있다. 렌더링 엔진의 기본적인 동작은 다음과 같다.



 처음에  HTML 문서를 파싱하고 태그를 DOM 노드로 변환해준다. 그 다음 부분까지는 주제에서 벗어나니 다른 글에 남겨야겠다. 


Window 객체란?

 이 객체의 주 역할은 클라이언트 측 자바스크립트 프로그램의 전역 객체이다. 그래서 Window 객체의 property들은 많은 API로 구현되어 있다. 이름이 Window인 이유는 브라우저의 창과 관련되어 있기 때문이다. 예를 들어 브라우저의 크기, 히스토리, url 등과 같은 것들이 있다.

저작자표시 (새창열림)