프론트엔드 (Front-End)/자바스크립트 ( Javascript )

<JavaScript> location.href 페이지 이동

xxvigrufv 2022. 10. 3. 15:17
반응형

질문 : Javascript 에서 페이지 이동은 어떻게 할것인가? 

방법은 대표적으로 2가지의 방법이 있다. 
location.href  location.replace().

location.href에서 href는 객체에 속해 있는 설정으로 현재 접속중인 페이지의 정보를 갖고 있다. 
그리고 그 값을 변경할 수 있는 프로퍼티 이기 때문에 다른 페이지로 이동하는데도 사용되고 있다. 

현재 페이지 확인 방법 

location.href;
// https://10.13.10.21:8080/outpage



location.href 로 페이지 이동 방법

location.href = "www.naver.com";


//네이버로 이동하게 된다. 

location.href vs location.replace()의 차이 
location.href는 객체의 속성이며, loaction.replace()는 메서드(함수)로 작동된다.
href는 페이지를 이동하는 것이기 때문에 뒤로가기 버튼을 누른경우 이전 페이지로 이동이 가능하지만,
replace는 현재 페이지를 새로운 페이지로 덮어 씌우기 때문에 이전 페이지로 이동이 불가능하다.
href는 일반적인 페이지 이동시 이용을 하면 되고,
replace의 경우는 이전페이지로 접근이 필요없는경우 보안상 덮어씌우는 것도 괜찮을듯 하다.

그리고 참고로 추가로, 
window.location.href 와 location.href 는 같다.

개발자도구 (F12) 를 열고 봐보자 

window.location === location;
//true
window.location.href;
//'https://kin.naver.com/qna/'
location.href;
//'https://kin.naver.com/qna/'
반응형