본문 바로가기

프로그래밍/JavaScript

[JavaScript] location.replace, location.href 비교

반응형

location 객체의 속성인 href와 replace 를 비교해보자


location.href : 새로운 페이지로 이동

location.replace : 현재 페이지를 새로운 페이지로 변경




1
2
3
4
<script>
    location.href = "URL";
    location.replace = "URL";
</script>
cs


location.href는 말 그대로 새로운 페이지로 이동할 때 사용한다.

즉, 현재 페이지에서 설정한 URL 페이지로 이동하게 된다.


그렇다면 location.replace는?

겉으로 보기에는 똑같다.

둘다 새로운 페이지로 이동하는것 처럼 보인다.


하지만 두 개는 차이가 있다.


location.replace 는 새 페이지로 이동이 아닌 현재 페이지를 바꿔주는 것이며,

인터넷 임시파일을 쓰지 않는다. 즉, 함수가 실행될 때마다 매번 서버에 접속해서 페이지를 가져온다.



[예제]


1. 페이지A에서 location.href로 페이지B로 이동 후 location.href로 페이지 C로 이동

2. 페이지A에서 location.href로 페이지B로 이동 후 location.replace로 페이지 C로 이동


먼저 1번의 경우 페이지C에서 뒤로가기 버튼 클릭 시 어느 페이지로 가질까?

당연히, 페이지B로 이동된다.


그렇다면 2번의 경우는 어느 페이지로 이동될까?

페이지B가 아닌 페이지A로 이동된다.



반응형