[window 객체]
window 객체는 객체의 계층 구조에서 최상위에 존재하며 가장 기본적이면서도 중요한 객체다.
창 열기, 창 닫기, 창 크기 조절 등 창을 제어하는 다양한 작업을 할 수 있다.
사용형식)
window.속성 : window.속성 = 값
window.메소드() : window.메소드(인자 값)
예)
window.status="환영합니다." //상태 표시줄에 문자 표시
window.close() // 창을 닫는다.
window.open() // 새 창을 연다.
---------------- window 객체의 속성 -------------------
○ defaultStatus - 브라우저 상태 표시줄에 표시할 문자열의 초기 값 설정
○ status - 상태 표시줄에 표시할 문자열 지정
○ window - 창 자신을 가리킴
○ frames - 창에 포함된 프레임을 배열 형태로 지정
○ opener - open() 메소드를 사용해서 새 창을 열었을 경우, 새 창을 열도록 한 문서를 가리킴
○ parent - 주종 관계를 이루고 있는 프레임 문서에서 상위 프레임을 가리킴
○ self - 현재 작업 중인 창, 즉 자기자신을 가리킴
○ top - 프레임이 설정되기 전의 상태로 돌아감, 프레임을 모두 무시하고 창 하나만 남음
○ classes - 문서 안에 정의된 모든 스타일시트의 정보를 갖음
○ tags - 문서 안에 정의된 모든 태그의 정보를 나타냄
○ screenX - 창의 x 좌표 반환
○ screenY - 창의 y 좌표 반환
○ closed - 창이 닫혀 있는지 확인한 후 true, false 반환
○ name - 창 이름 반환
○ length - 창 안에 프레임 수 반환
------------- 넷스케이프 네비게이터 전용 -----------○
○ innerHeight - 브라우저 내용의 높이
○ innerWidth - 브라우저 내용의 넓이
○ outerHeight - 브라우저 전체 높이
○ outerWidth - 브라우저 전체 넓이
○ pageXoffset - 현재 나타나는 페이지의 x 좌표
○ pageYofset - 현재 나타나는 페이지의 y 좌표
---------------- window 객체의 메소드 -------------------
※ 윈도우 객체에서 사용할수 있는 이벤트 핸들러로는 onBlur, onDragdrop, onError, onFocus, onLoad, onUnload 가 있다.
----------------->사용자의 응답을 요구하는 대화상자를 생성하는 메소드<---------------------
○ alert("메시지") - 경고 창 띄움
○ prompt("메시지","구문") - 입력 창 띄움
○ confirm("메시지") - 확인, 취소 창 띄움
-----------------> 창 생성과 제거 메소드 <---------------------
○ open("문서명","창이름","속성") - 새 창을 염
○ close() - 창을 닫음
----------------->브라우저 크기, 위치 설정 <---------------------
○ moveBy(x,y) - 브라우저를 상대좌표로 지정한 픽셀만큼 이동
○ moveTo(x,y) - 브라우저를 절대좌표로 지정한 위치로 이동
○ resizeBy(x,y) - 브라우저의 크기를 상대적으로 지정한 픽셀만큼 설정
○ resizeTo(x,y) - 브라우저의 크기를 절대 값으로 지정한 픽셀만큼 설정
○ scroll(x,y) - 창이나 프레임 안의 내용을 스크롤함
○ scrollBy(x,y) - 스크롤을 상대좌표로 이동
○ ScrollTo(x,y) - 스크롤을 절대좌표로 이동
-----------------> 동작 시간 간격을 조절하는 메소드 <---------------------
○ setTimerout("명령문",시간간격) - 일정한 시간 간격으로 명령문을 반복 실행 (시간 1/1000초 단위)
○ clearTimerout() - SetTimerout() 으로 동작되는 타이머 해제
-----------------> 기타 <---------------------
○ print() - 현재 문서 출력----------------->넷스케이프 네이게이터 전용<---------------------
○ back() - 한단계 이전 URL로 이동
○ forward() - 한단계 이후의 URL로 이동
○ home() - 브라우저에세 home으로 지정된 URL으로 이동
○ stop() - 브라우저의 stop 버튼처럼 불러오기 중지
○ find("문자열") - 지정된 문자열이 있는지 검사(true,false 값)
----------------------------------------------------------------------
=== open() 메소드로 창열기 ===
open() 메소드는 새 창을 열어준다. 옵션을 다양하게 설정하여 다양한 모양의 새 창을 열 수 있다.
window.open() 메소드의 인자 값은 반드시 세 개를 포함해야 한다. 아무런 속성도 지정하지 않을경우에는
window.open("","","") 와 같이 입력한다.
형식) window.open("문서명","창이름","설정");
예) 다음 코드는 allim.html 문서를 좌표 50, 50 위치에 200*300 크기로 새 창을 연다. window.open("allim.html","popup","top=50 left=50 width=200 height=300")
---------- window.open() 메소드에 설정할 수 있는 창 옵션 --------------------
○ directories : yes/no - 연결 등 디렉토리 메뉴 표시 여부
○ menubar : yes/no - 메뉴 바 표시 여부
○ toolbar : yes/no - 툴 바 표시 여부
○ location : yes/no - 주소 입력줄 표시 여부
○ resizable : yes/no - 크기 재설정 버튼 표시 여부
○ status : yes/no - 상태 표시줄 표시 여부
○ scrollbars : yes/no - 스크롤 바 표시 여부
○ copyhistory : yes/no - 히스토리 정보를 저장할지 여부
○ channelmode - 전체화면 모드
○ fullscreen - 전체화면으로 표시
○ width : pixel - 창 넓이
○ height : pixel - 창 높이
○ left : pixel - 창의 좌측 좌표 값
○ top : pixel - 창의 위쪽 좌표 값
----------------------------------------------------------------------
[실습하기]
----------------------open 으로 창 열기 예제-----------------------------------
<html><head> <title>Test</title>
<s-ript language="javas-ript">
function openWin(){ window.open("allim1.htm","","width=250 height=385 left=100 top=100 directories=no");}
</script></head>
<body -nload="openWin()">
</body>
</html>
---------------------------------------------------------------------
----------------------close 으로 창 닫기 예제-----------------------------------
현지 활성화된 창을 닫을 때는 아래 세 가지 명령어 중 하나를 사용한다.
window.close()
self.close()
this.close()
만약 특정 창을 닫으려면 창을 열 때 해당 창에 객체명을 지정해야 한다.
1. 새 창을 열 때 창에 객체명 지정하기 윈도우 객체명 = window.open("문서명","창이름","옵션설정")
2. 새 창으로 열린 창 닫기 윈도우 객체명.close()
---------------------------------------------------------------
[실습하기]
------------------- 객체명.close() 으로 창닫기 -----------------------
<html><head> <title>Test</title>
<s-ript language="javas-ript">
var win = null
function openWin(){ win = open("allim1.htm","","width=250 height=385 left=100 top=100 directories=no");}
function closeWin(){ win.close();
}
</script></head>
<body>
<img src=images/zoom.gif style="cursor:hand" onclick="openWin()">
<form name=info><input type=button name=bt value=창닫기 onclick="closeWin()"></form>
</body>
</html>
--------------------------------------------------
출처 : http://blog.naver.com/kimgudtjr/140097965840
[출처] [18장] 자바스크립트 - window객체|작성자 어른아이
'Programming > HTML/JavaScript/CSS' 카테고리의 다른 글
[JavaScript] jQuery의 기본 (0) | 2012.12.17 |
---|---|
[JavaScript] substr (문자열 나누기) 사용 (0) | 2012.12.17 |
[CSS] 인터넷 익스플로러 6,7,8에서 CSS3 사용하기 (PIE) (0) | 2012.10.07 |
[CSS] border-radius 생성기 (0) | 2012.10.07 |
웹 프로그래밍 언어별 no-cache (페이지 만료) 방법 (0) | 2012.10.07 |