⚫window 객체 : 브라우저를 객체로 표현하여 프로퍼티와 메소드 제공하는 객체
⚫BOM(Browser Object Model) : 브라우저를 기반으로 제공되는 자바스크립트 객체
🔘window 객체의 메소드 살펴보기
window.alert(message) : 경고창을 생성하여 매개변수로 전달받은 메세지를 출력하는 메소드
=> 두번째 줄과 같이 window 객체를 생략하여 메소드 호출 가능 - 함수
window.alert("경고창을 이용하여 메세지를 출력하는 메소드");
alert("경고창을 이용하여 메세지를 출력하는 메소드");
window.prompt(message[, value]) : 입력창을 생성하여 사용자로부터 값을 입력받아 문자값으로 반환하는 메소드
=>자바에서 scanner 객체를 써서 콘솔로 입력값 받는거랑 비슷한 느낌
var input=prompt("숫자를 입력해 주세요.",100);
alert("input = "+input);
=>value값에 100을 적어놓으니, 경고창이 떴을 때 기본으로 100이 입력되어 있음.
window.confirm(message) : 확인창을 생성하여 사용자로부터 선택된 값을 반환하는 메소드
=> 확인창에서 [취소]를 선택하면 [false]를 반환하고 [확인]을 선택하면 [true]를 반환
if(confirm("정말로 삭제 하시겠습니까?")) {
alert("게시글을 삭제 하였습니다.");
} else {
alert("게시글 삭제을 취소 하였습니다.");
}
window.open(url[, name][, option]) : 자식 브라우저(팝업창)를 생성하고 자식 브라우저에서 웹프로그램을 요청해 실행결과를 응답받아 출력하는 메소드
=> option : width, height, top, left, menubar, toolbar, resizable 등
window.close() : 현재 사용중인 브라우저를 종료하는 메소드
window.open("https://www.daum.net", "popup", "width=1000, height=640, top=100, left=200");
if(confirm("브라우저를 종료 하시겠습니까?")) {
window.close();
}
실습예제 전체 코드👩💻
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<script type="text/javascript">
//alert(window);//[object Window]
//window.alert(message) : 경고창을 생성하여 매개변수로 전달받은 메세지를 출력하는 메소드
// => window 객체를 생략하여 메소드 호출 가능 - 함수
window.alert("경고창을 이용하여 메세지를 출력하는 메소드");
alert("경고창을 이용하여 메세지를 출력하는 메소드");
//window.prompt(message[, value]) : 입력창을 생성하여 사용자로부터 값을 입력받아 문자값으로
//반환하는 메소드
var input=prompt("숫자를 입력해 주세요.",100);
alert("input = "+input);
//window.confirm(message) : 확인창을 생성하여 사용자로부터 선택된 값을 반환하는 메소드
// => 확인창에서 [취소]를 선택하면 [false]를 반환하고 [확인]을 선택하면 [true]를 반환
if(confirm("정말로 삭제 하시겠습니까?")) {
alert("게시글을 삭제 하였습니다.");
} else {
alert("게시글 삭제을 취소 하였습니다.");
}
//window.open(url[, name][, option]) : 자식 브라우저(팝업창)를 생성하고 자식 브라우저에서
//웹프로그램을 요청해 실행결과를 응답받아 출력하는 메소드
// => option : width, height, top, left, menubar, toolbar, resizable 등
//window.open("https://www.daum.net", "popup", "width=1000, height=640, top=100, left=200");
if(confirm("브라우저를 종료 하시겠습니까?")) {
//window.close() : 현재 사용중인 브라우저를 종료하는 메소드
window.close();
}
</script>
</body>
</html>
참고:
https://opentogether.tistory.com/110
전역객체 Window와 BOM, DOM의 정의
Window 객체 Window 객체는 모든 객체가 포함된 최상위 객체이며, 브라우저의 창이나 프레임을 의미합니다. 다시말해서 Window 객체는 전역객체로, 전역변수와 전역스코프에서 선언된 함수는 Window 객
opentogether.tistory.com
https://cbw1030.tistory.com/46
[Javascript] Window, DOM, BOM이란?
나는 자바스크립트 언어를 Window, DOM, BOM이 정확히 무엇을 의미하는지도 모른채 사용해왔다. 사실 Window, DOM과 BOM을 이해하기 위해 과거에 여러 문서를 보고 구글링도 했었지만 와닿지가 않았고
cbw1030.tistory.com
'Frontend > JavaScript' 카테고리의 다른 글
SPA(Single Page Application)란? (0) | 2025.04.10 |
---|---|
[JavaScript]JSON 클래스 함수 (0) | 2024.01.09 |
[JavaScript]Math 클래스 함수 (0) | 2024.01.08 |
[JavaScript]Date 클래스 함수 (0) | 2024.01.08 |
[JavaScript] String 클래스 함수 (1) | 2024.01.08 |