자바스크립트 오브젝트 모델(Javascript Object Model)
웹 브라우저의 구성요소들은 객체화 되어 있습니다.
자바스크립트를 활용하여 이 객체를 제어할 수 있고 이 객체들은 서로 계층적인 관계로 이루어져 있습니다.
BOM DOM은 이 구조를 구성하고 있는 가장 큰 틀의 분류라고 할 수 있습니다.
(출처 : http://learn.javascript.ru/browser-environment)
여기서 window는 전역 객체이자 최상위 계층의 객체입니다.
브라우저 창 하나에는 각기 하나의 window객체가 있고 window 객체는 전역 객체 라고 불려집니다.
Javascript Core(내장 객체)
내장 객체는 자바스크립트 엔진에 내장되어 있어, 필요한 경우 생성해 사용할 수 있습니다.
내장 객체로는 문자(String), 날짜(Date), 배열(Array), 수학(Math)객체 등이 있습니다.
DOM(Document Object Mode)는 웹 페이지 내의 모든 요소에 접근 가능케하는 표준 API 입니다.
HTML의 기본 구조는 최상위 객체로 <html>이 있으며 그 하위 객체로는 <head>와 <body>가 있습니다. 문서객체모델(DOM)을 통해 여러 요소들을 객체로 선택하여 속성을 바꾸고 Style을 CSS를 통해 변경할 수 있습니다.
BOM(Browser-Object-Mode)이란 브라우저에 계층적으로 내장되어 있는 객체를 말합니다.
쉽게 말해 웹 브라우저 기능 요소를 직접 관리/제어할 수 있는 특별한 객체 모음이라고 할 수 있습니다.
브라우저 객체로는 위의 사진과 같이 navigator, screen, location 등등과 같은 것들이 있습니다.
한 가지 예로 자바스크립트를 이용하여 현재 열린 사이트에서 다른 사이트를 이동시키려면
window.locatioh.href = "이동할 URL";을 이용하여 사이트를 변경할 수 있습니다.
위의 사진은 window.location.href 속성을 이용하여 현재 사이트 주소를 불러오는 것을 보여주고 있습니다. 다만 window가 생략되어도 정상적으로 동작한다는 것입니다. 이유는 window가 전역객체이기 때문입니다.
위의 사진은 location.href에 이동할 페이지 주소를 입력하여 이동하는 것을 예제로 보여주고 있습니다.
'JavaScript' 카테고리의 다른 글
| 자바스크립트 이벤트(Event) 위임하기 (0) | 2017.05.18 |
|---|---|
| 자바스크립트 브라우저 객체 모델(BOM) - Screen 객체 (0) | 2017.01.10 |
| 자바스크립트 브라우저 객체 모델(BOM) - History 객체 (0) | 2016.12.02 |
| 자바스크립트 브라우저 객체 모델(BOM) - Navigator 객체 (0) | 2016.12.02 |
| 자바스크립트 브라우저 객체 모델(BOM) - Location 객체 (0) | 2016.12.02 |
