11.4.1 window 객체의 속성과 메서드
window 객체에는 웹 브라우저의 기능과 요소들을 제어할 수 있는 여러 속성과 메서드가 있는데, 주요 속성과 메서드는 다음 표와 같습니다. 이 중에서 window 객체의 기본 속성과 웹 브라우저의 새로운 창 및 스크롤을 제어하는 메서드만 살펴보겠습니다.
표 11-6 window 객체의 주요 속성과 메서드
|
구분 |
설명 |
|
|
속성 |
innerWidth |
웹 브라우저 화면의 너비를 px(픽셀) 단위로 나타냅니다. |
|
innerHeight |
웹 브라우저 화면의 높이를 px 단위로 나타냅니다. |
|
|
outerWidth |
웹 브라우저 창의 너비를 px 단위로 나타냅니다. |
|
|
outerHeight |
웹 브라우저 창의 높이를 px 단위로 나타냅니다. |
|
|
screenTop/screenY |
웹 브라우저 위쪽 면과 모니터의 간격을 px 단위로 나타냅니다. |
|
|
속성 |
screenLeft/screenX |
웹 브라우저 왼쪽 면과 모니터의 간격을 px 단위로 나타냅니다. |
|
pageXOffset/scrollX |
웹 브라우저의 수평 스크롤 위치를 px 단위로 나타냅니다. |
|
|
pageYOffset/scrollY |
웹 브라우저의 수직 스크롤 위치를 px 단위로 나타냅니다. |
|
|
메서드 |
alert() |
알림창을 표시합니다. |
|
confirm() |
확인창을 표시합니다. |
|
|
prompt() |
입력창을 표시합니다. |
|
|
open() |
새로운 웹 브라우저 창을 엽니다. |
|
|
close() |
웹 브라우저 창을 닫습니다. |
|
|
setTimeout() |
일정 시간(ms) 뒤에 콜백 함수를 한 번만 실행합니다. |
|
|
setInterval() |
일정 시간(ms)마다 콜백 함수를 반복적으로 실행합니다. |
|
|
clearInterval |
setInterval() 메서드로 반복 실행되는 함수를 중지합니다. |
|
|
scrollTo() |
웹 브라우저의 스크롤을 특정 위치만큼 이동합니다. |
|
|
scrollBy() |
웹 브라우저의 스크롤을 현재 위치에서 상대적 위치로 이동합니다. |
|
Note 같은 기능의 속성
표 11-6을 보면 screenTop/screenY처럼 기능이 같은 속성들이 있습니다. 이 속성들은 반환하는 결과는 같지만, IE 버전마다 차이가 있습니다. IE 버전 호환성이 좋은 속성은 screenTop, screenLeft, pageXOffset, pageYOffset입니다. 반대로 IE 버전 호환성이 낮은 속성은 screenY, screenX, scrollX, scrollY입니다. 만약 IE 버전까지 고려해야 한다면 호환성이 좋은 속성을 사용하는 편이 좋습니다.