Javascript - 브라우저 객체 모델

브라우저 객체 모델은 웹 브라우저와 관련된 객체의 집합이다.

Window 객체 밑에 Location객체, navigator객체, history객체, screen객체, document객체 가 존재한다.

아래 그림은 각 객체가 담당하는 구간을 표시한 그림이다.

Screen객체는 화면 전체를 관리한다. 그 밑으로 웹 브라우저와 관련된 객체인 Navigator객체가 존재한다. History객체는 브라우저의 뒤로가기 앞으로 가기와 같은 기록에 관련된 객체이고 Location은 URL 주소와 관련된 객체이다. 마지막으로 Document 객체는 브라우저의 내용인 HTML문서와 관련된 객체이다.

* 새로운 window 객체 생성

opne(URL, name, features, replace)

window.open() 을 통하여 객체를 생성 할 수 있다. URL은 주소, features는 옵션이다. open 메서드는 객체를 생성한뒤 윈도 객체를 리턴한다. 변수(var 선언)를 통하여 생성된 객체를 조작 가능하다.

메서드	설명
moveBy(x,y)	윈도우 위치를 상대적으로 이동
moveTo(x,y)	윈도우 위치를 절대적으로 이동
resizeBy(x,y)	윈도우 크기를 상대적으로 지정
resizeTo(x,y)	윈도우 크기를 절대적으로 지정
scrollBy(x,y)	윈도 스크롤의 위치를 상대적으로 이동
scrollTo(x,y)	윈도 스크롤의 위치를 절대적으로 이동
focus()	윈도에 초점을 맞춤
blur()	위도에 초점을 제거
close()	윈도 객체를 닫는다

위 표는 윈도우 객체의 메서드이다. By로 끝나는 메서드는 상대적으로 속성을 변화시키며 To 로 끝나는 메서드는 절대적으로 속성을 변경한다.

* onload 이벤트 

일반적으로 HTML은 맨 위부터 순차적으로 코드를 실행한다. 하지만 onload를 사용하면 모든 코드가 실행되고 제일 마지막에 실행이 된다.

ex)

<script>

window.onload = function() {

alert('제일 마지막에 실행됨');

};

</script>