목차
Window 객체
- Window 객체는 웹 브라우저의 창을 나타내는 객체입니다.
- 브라우저 창 안에 존재하는 모든 요소의 최상위 객체로서, 자바스크립트의 모든 객체, 전역 함수, 전역 변수들은 자동으로 Window 객체의 프로퍼티가 됩니다.
- Window 객체의 메소드는 전역 함수이며, Window 객체의 프로퍼티는 전역 변수가 됩니다.
- Window 객체는 브라우저 창이 열릴 때마다 하나씩 생성됩니다.
Window 객체의 프로퍼티
| 프로퍼티 | 설명 |
| document | window에서 보여지는 현재 문서를 의미 |
| name | window의 이름을 리턴 |
| history | window의 history객체를 의미 |
| location | window의 location객체를 의미 |
| navigator | window의 navigator객체를 의미 |
| screen | window의 screen객체를 의미 |
| opener | 새롭게 생성된 window에서 이전 window의 참조값을 리턴 |
| parent | 현재 window의 부모 window 객체를 리턴 |
| self | 현재 window의 참조값을 리턴 |
| top | 가장 최상위 window의 참조값을 리턴 |
Window 객체의 메소드
| 메소드 | 설명 |
| alert([message]) | 경고 대화 상자를 띄움 |
| prompt([message, default]) | 텍스트를 입력할 수 있는 대화 상자를 띄움 |
| confirm([message]) | 확인 또는 취소를 선택할 수 있는 대화 상자를 띄움 |
| open() | 새로운 window 창을 띄움 |
| close() | window 창을 닫음 |
| moveTo(x, y) | 명시된 위치로 현재 window를 움직임 |
| print() | 현재 window의 내용을 출력 |
| setTimeout(function[, delay, arg1, arg2, ...]) | 명시된 시간 후 특정 작업 한 번 수행 |
| setInterval(function[, delay, arg1, arg2, ...]) | 명시된 시간마다 특정 작업 반복 수행 |
| clearInterval(intervalID) | setInterval()에 의한 반복 작업 종료 |
| focus() | 현재 window에 포커스를 지정할 때 사용 |
| blur() | 현재 window의 포커스를 제거할 때 사용 |
alert([message])
경고 대화 상자를 띄웁니다.
alert("경고문!!!");
prompt([message, default])
텍스트를 입력할 수 있는 대화 상자를 띄웁니다.
var data = prompt("입력하세요.", "default");
console.log(data);
confirm([message])
확인 또는 취소를 선택할 수 있는 대화 상자를 띄웁니다.
if (confirm("확인을 누르면 콘솔창에 출력")) {
console.log("확인을 누름");
}
open(), close()
새로운 window 창을 띄우거나, window 창을 닫습니다.
<!-- 부모창 HTML -->
...
<script type="text/javascript">
var child;
function openWindow() {
child = window.open("child.html", "childName", "width=300, height=300");
}
function closeChild() {
child.close(); //자식창 닫기
}
function closeWindow() {
window.close(); //내창 닫기
}
</script>
</head>
<body>
부모 창 페이지<br>
<button onclick="openWindow()">새 창 띄우기</button>
<button onclick="closeChild()">자식창 닫기</button>
<button onclick="closeWindow()">창닫기</button>
</body>
...<!-- 자식창 HTML -->
...
<script type="text/javascript">
function closeWindow() {
window.close(); //내창 닫기
}
function closeOpener() {
opener.close(); //나를 연 창 닫기
}
</script>
</head>
<body>
이 페이지는 자식 페이지입니다.<br>
<button onclick="closeWindow()">창닫기</button>
<button onclick="closeOpener()">부모창 닫기</button>
</body>
...
setTimeout(function[, delay, arg1, arg2, ...])
명시된 시간 후 특정 작업을 한 번 수행합니다.
setTimeout(function () {
console.log("2초 후 콘솔창에 출력");
}, 2000);
setInterval(function[, delay, arg1, arg2, ...])
명시된 시간마다 특정 작업을 반복 수행합니다.
var test = setInterval(function () {
console.log("2초마다 콘솔창에 출력");
}, 2000);
clearInterval(intervalID)
setInterval()에 의한 반복 작업을 종료합니다.
setTimeout(function () {
clearInterval(test)
}, 10000); //10초 후 종료
참고
https://developer.mozilla.org/ko/docs/Web/API/Window/
http://www.tcpschool.com/javascript/js_bom_window
'WEB > JavaScript' 카테고리의 다른 글
| [JavaScript] DOM (문서 객체 모델) (0) | 2022.07.02 |
|---|---|
| [JavaScript] BOM (브라우저 객체 모델) (0) | 2022.06.28 |
| [JavaScript] 문자열 (String) 객체 (0) | 2022.06.27 |
| [JavaScript] 배열 (Array) 객체 (0) | 2022.06.27 |
| [JavaScript] 자바스크립트 기초 문법 - 함수 (0) | 2022.06.27 |
댓글