반응형
자바스크립트 를 사용해서 새로운 윈도우 창을 열 수 있습니다.
새로운 윈도우를 여는 함수는 window.open() 입니다. window는 자바스크립트 최상위 클래스 이며 기본 클래스로써
편의상 window 를 생략하고 사용할 수 있습니다.
예제를 통해 알아보겠습니다.
1. 신규 팝업창을 호출할 웹 문서를 만듭니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>새 윈도우 팝업창 열기예제</h1>
<script>
window.open("testPopup.html","popup" , "width=300, height=400, left=300 , top=300");
</script>
</body>
</html>여기서 중요한 것은 바로. open 함수 입니다
window.open("testPopup.html","popup" , "width=300, height=400, left=300 , top=300");
첫번째 인자는 열고자 하는 파일명.
두번째 인자는 윈도우에 이름을 주어서 여러번 열리는 것을 방지하는 것 입니다.
세번째 인자는 윈도우의 크기 및 좌측 상단에서 얼마나 떨어져서 그릴지를 설정하는 역할을 합니다.
2. 새로 열릴 윈도우를 만듭니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h3>새로운 팝업창 입니다</h3>
</body>
</html>웹 브라우저에서 실행해보면 하기와 같은 결과를 얻을 수 있습니다.
자바스크립트 에서 새로운 윈도우를 열때는,
window.open() 함수를 사용 하면 됩니다. 감사합니다.
반응형
'앱 만들기 > JavaScript study' 카테고리의 다른 글
| 윈도우 창 닫기 함수 (1) | 2023.01.12 |
|---|---|
| 자바스크립트 함수만들기 (2) | 2023.01.11 |
| 자바스크립트 콘솔창 단축키 (6) | 2023.01.02 |
| 자바스크립트 로그 함수 (2) | 2023.01.01 |
| 자바스크립트 출력함수 document.write() (2) | 2022.12.31 |
댓글