BOM

BOM (Browser Object Model)

웹 브라우저를 JavaScript 의 객체로 다루는 방법을 알아봅니다.

•

Window

•

Screen

•

Location

•

History

브라우저 창을 다루는 객체

창(팝업 창) 열기, 닫기, 이동, 크기 확인 및 조절 등을 할 수 있다.

•

주요 속성

속성	설명
innerWidth	현재 창의 내부 너비를 픽셀 단위로 나타냅니다. 스크롤바를 제외한 내용 영역의 너비입니다.
innerHeight	현재 창의 내부 높이를 픽셀 단위로 나타냅니다. 스크롤바를 제외한 내용 영역의 높이입니다.
outerWidth	현재 브라우저 창의 외부 너비를 픽셀 단위로 나타냅니다. 브라우저 창 전체의 너비를 포함합니다.
outerHeight	현재 브라우저 창의 외부 높이를 픽셀 단위로 나타냅니다. 브라우저 창 전체의 높이를 포함합니다.

•

주요 메소드

메소드	설명
open()	새로운 브라우저 창을 열거나 새 탭을 엽니다. window.open(url, name, specs, replace) 형식으로 사용됩니다. 주로 팝업 창을 열 때 사용됩니다.
close()	현재 브라우저 창을 닫습니다.주로 팝업 창을 닫을 때 사용됩니다.
moveTo()	브라우저 창의 위치를 지정된 좌표로 이동시킵니다. window.moveTo(x, y) 형식으로 사용됩니다.
resizeTo()	브라우저 창의 크기를 지정된 너비와 높이로 조절합니다. window.resizeTo(width, height) 형식으로 사용됩니다.
scrollTo()	문서를 지정된 좌표로 스크롤합니다. window.scrollTo(x, y) 형식으로 사용됩니다.
alert()	경고 창을 띄워 메시지를 표시합니다.사용자에게 정보를 알리는 데 사용됩니다.
confirm()	확인 대화 상자를 띄워 사용자에게 예 또는 아니오를 선택하게 합니다. 사용자의 선택에 따라 불린 값을 반환합니다.
prompt()	프롬프트 대화 상자를 표시하여 사용자로부터 입력을 받습니다. 사용자의 입력을 문자열로 반환합니다.

디스플레이의 화면에 대한 정보를 가진 객체

•

주요 속성

웹 페이지의 위치(주소) 정보를 다루는 객체

•

주요 속성

속성	설명
href	현재 페이지의 주소(URL) (http://127.0.0.1:5500/Test/location.html?name=ALOHA&age=20)
hostname	호스트 네임 (127.0.0.1)
port	포트번호 (5500)
pathname	페이지 경로 (/Test/location.html)
protocol	프로토콜 (http:)
search	쿼리스트링 (?name=ALOHA&age=20)

•

주요 메소드

메소드	설명
assign( )	지정한 경로(url)로 페이지를 이동하는 메소드
replace( )	지정한 경로(url)로 페이지를 변경하는 메소드 (뒤로가기 불가)
reload( )	페이지를 새로고침하는 메소드

브라우저의 기록을 다루는 객체

메소드	설명
back( )	뒤로 가기
forward( )	앞으로 가기
go( )	지정한 크기 만큼 기록 이동 * -2 : 뒤로 2페이지 이동 * +2 : 앞으로 2페이지 이동