11주차 - jsp&js (25) window.open()
2022. 9. 21. 17:24ㆍjsp/java script
이번의 목표
01. window.open() 을 사용하여 다른 사이트로 이동해보자
window.open()를 사용하면 괄호 안의 링크로 이동합니다. 이때 괄호안에 페이지를 여는 옵션을 설정할 수 가 있습니다.
형식은 아래와 같습니다.
window.open("주소", "target 속성", "화면사이즈, 위치")
target 속성에는 _self , _blank 가 있습니다.
_self : 현재 화면에서 페이지를 엽니다.
_blank : 새 화면에서 페이지를 엽니다. (default)
target 속성을 아예 입력하지 않는다면 화면은 새탭에서 열리게 됩니다.
target 속성을 입력하되, "" (공백) 으로 남겨 놓는다면 _blank 로 인식하여 새 창을 띄워줍니다.
화면 사이즈와 위치를 조정하는 데에는 아래의 네가지 속성을 사용합니다.
width : 너비
height : 높이
top : 상단 끝에서 부터의 간격
left : 왼쪽 끝에서 부터의 간격
01. 코드
02. 실행 화면
01. 코드
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function myclick() {
//window.open("https://www.naver.com")
window.open("https://www.naver.com", "_self")
//window.open("https://www.naver.com","","width=1000, height=800, top=100, left=300");
/*
*window.open()의 네가지 사용 예시
①window.open("주소", "여는 옵션", "화면 사이즈, 위치")
②window.open("주소","화면사이즈, 위치")
③window.open("주소","여는 옵션")
④window.open("주소")
1) 세가지 옵션을 모두 사용 한다.
2) 이때 화면은 새탭에 열린다.
3) 이때에 _self 는 현재 화면 그대로 열린다.
하지만 _blank는 새 탭에서 열린다.
4) 새 탭에 화면이 열린다.
_blank : 새창에 열기
_self : 현재창에 열기
위의 옵션을 적는 곳에 "" 만 입력하면 _blank 가 기본으로 들어간다.
width : 너비
height : 높이
top : 상단 끝에서 부터의 간격
left : 왼쪽 끝에서 부터의 간격
*/
}
</script>
</head>
<body>
<input type="button" value="새창" onclick="myclick()">
<br>
<label onclick="myclick()">네이버로 가자</label>
</body>
</html>02. 실행 화면
① 버튼을 눌렀을 때에 현재 창 그대로 네이버가 열리는 것을 확인할 수 있습니다.
'jsp > java script' 카테고리의 다른 글
| 12주차 - jsp&js (27) onkeyup, <input type="button> (1) | 2022.09.21 |
|---|---|
| 11주차 - jsp&js (26) onload (0) | 2022.09.21 |
| 11주차 - jsp&js (24) confirm() (2) | 2022.09.21 |
| 11주차 - jsp&js (23) window.history.forward() / window.history.back() (0) | 2022.09.19 |
| 11주차 - jsp&js (22) onmouseup/onmousedown 으로 이미지를 바꿔보자 (0) | 2022.09.19 |