JavaScript 공부 ( 페이지

1. 페이지 이동

  • 뒤로 경로 O(새 페이지로 전환)
    • window.location.href = URL
  • 경로 X 되돌리기(기존 페이지 → 새 페이지 전환)
    • window.location.replace(url)

2. 새 탭에서 열기, 새 창에서 열기

open()
open(url)
open(url, target)
open(url, target, windowFeatures)
  • url – 로드할 리소스의 URL 또는 경로를 나타내는 문자열
  • target – 리소스가 로드될 검색 컨텍스트의 이름을 지정하는 문자열
목표 설명
_비어 있는 새 창에서 열기(기본값)(새 탭에서 열기)
_부모의 상위 프레임에서 엽니다.

_본인 현재 페이지를 대체합니다
_맨 위 로드된 프레임셋을 교체합니다.

이름: (선택 사항) 새 창이 열리고 창 이름이 지정됩니다.

(새 창에서 열립니다)
  • windowFeatures(옵션)
가능성 설명
전체 화면 예, 아니오, 1, 0 팝업 전체 화면 표시 여부 (IE에서만 작동)
툴바 예, 아니오, 1, 0 상단 도구 창 표시 여부 (IE, FireFox에서만 작동)
위치 예, 아니오, 1, 0 메뉴 아이콘 표시 여부(Opera에서만 작동)
크기 조정 가능 예, 아니오, 1, 0 팝업 창 크기 조정 가능 여부(Chrome에서는 작동하지 않음)
스크롤바 예, 아니오, 1, 0 팝업 스크롤바 사용 여부
메뉴 모음 예, 아니오, 1, 0 메뉴 출력
넓은 숫자 팝업 창의 너비
숫자 팝업 창의 세로 길이
맨 위 숫자 윈도우 화면 상단에서 팝업 위치 지정
왼쪽 숫자 윈도우 화면 좌측에서 팝업 위치 지정

전)

//href
window.location.href = "http://naver.com";

//replace
window.location.replace("http://naver.com");

//새 탭에서 열기
window.open("http://naver.com","_blank");

//새 창에서 열기
window.open("http://naver.com","이름",`width=${screen.width*0.7}, height=${screen.height*0.7}`);

참조:

https://developer.mozilla.org/en-US/docs/Web/API/Location/href

location.href – 웹 API | MDN

Location 인터페이스의 href 속성은 전체 URL을 포함하는 문자열을 반환하고 href가 업데이트되도록 허용하는 Stringifier입니다.

developer.mozilla.org

https://developer.mozilla.org/en-US/docs/Web/API/Location/replace

location.replace() – 웹 API | MDN

Location 인터페이스의 replace() 메서드는 현재 리소스를 제공된 URL의 리소스로 바꿉니다.

assign() 메서드와의 차이점은 replace()를 사용한 후 현재 페이지가 세션 히스토리에 저장되지 않는다는 점입니다.

즉, 사용자가 이겼다는 의미입니다.

developer.mozilla.org

https://developer.mozilla.org/en-US/docs/Web/API/Window/open

Window.open() – 웹 API | MDN

Window 인터페이스의 open() 메서드는 지정된 이름을 가진 지정된 리소스를 새로운 또는 기존 브라우저 컨텍스트(즉, 탭, 창 또는 iframe)로 로드합니다.

developer.mozilla.org

https://inpa.entry/JS-%F0%9F%93%9A-windowopen-%EC%A0%95%EB%A6%AC

(JS) window.open/close (새 창 열기/닫기) 사용 방법 요약

window.open(새 창 열기) 웹 브라우저에서 새 창(팝업 창)을 여는 가장 쉬운 방법은 JavaScript 창 개체의 open() 함수를 사용하는 것입니다.

var popup = window.open(‘팝업

inpa.tistory.com