[Java Script] DOM, BOM 이란?

DOM과 BOM에 대해서 알아보기 전에 큰 그림을 먼저 보고 가도록 하자

 

 

문서객체모델(DOM, document object model)

html, XML 문서의 프로그래밍 interface이다.

DOM은 문서의 구조화 된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근 할 수 있는 방법을 제공하여 그들의 문서 구조 및 스타일, 내용 등을 변경할 수 있게 돕는다.

웹페이지는 일종의 문서이다. 이 문서는 웹브라우저를 통해 그 내용이 해석되어 웹브라우저 화면에 나타나거나 html 소스 자체로 나타나기도 한다.

DOM은 웹페이지의 객체 지향 표현이며, 자바스크립트 와 같은 스크립팅 언어를 이용해 DOM을 수정 할 수 있다.

 

브라우저 객체 모델(BOM,Browser Object Model)

브라우저와 상호작용하는 메서드와 인터페이스

BOM을 이용하면 브라우저 창에 접근하고 조작할 수 있다.

브라우저 객체 모델 (browser object model)은 자바스크립트가 브라우저와 소통하기 위한 모델이다.

공식 표준은 아니지만 모든 브라우저 대부분이 자바스크립트 상호작용에 있어 비슷한 메소드와 속성으로 동작하기에 이와 같은 메소드들을 통칭하여 BOM이라고 한다.

• 브라우저 창을 새로 띄움
• 브라우저 창을 움직이거나 크기를 조절
• 브라우저의 실제 정보를 반환하는 navigator 객체
• 사용자의 화면 해사동에 대한 정보를 반환하는 location 객체
• 쿠키 지원
• XMLHttpRequest와 같은 커스텀 객체

 

 

💡 자주 사용하는 브라우저 내장 객체

• window : 브라우저 창이 열릴 때마다 하나씩 만들어지는 객체 (브라우저 창 안에 존재하는 모든 요소의 최상위 객체, 최고 부모)
• document : 웹 문서에서 태그를 만나면 만들어지는 객체, HTML 문서 정보를 가지고 있다.
• history : 현재 창에서 사용자 방문 기록을 저장하고 있는 객체
• location : 현재 페이지에 대한 URL 정보를 가지고 있는 객체
• navigator : 현재 사용 중인 웹 브라우저 정보를 가지고 있는 객체
• screen : 현재 사용 중인 화면 정보를 다루는 객체 </aside>