window.location.replace 和 window.location.href 的区别

昨天在处理一个具有返回功能的按钮时花了一些时间,就是返回到用户搜索的前一页,我用的是 window.location.go(-1),这就是正正经经的浏览器返回到前一条浏览记录的做法。可是有几个返回按钮却一直失灵,点击之后,可以看到浏览器刷新,但是还是停留在原来的页面。
仔细查看代码,终于发现了原因。就是用户从上一个页面 a 跳转到目前看到的这一个页面 c,其实中间还有一个页面 b,只是用户看不到,因为从 a 跳转到 b 后,执行 b 的脚本,b 的脚本有下面这句:

window.location.href = "c.html";

所以页面嗖的一下就跳到了 c 页面,但是浏览器记录却记录了三个页面:a, b, c.
这个时候点击返回按钮从 c 就是返回到 b,而 b 又会马上跳转到 c,所以就出现了点击返回按钮,页面刷新后,还是停留在原来页面的情况。
解决方案就是把上面重定位的脚本换成下面这句:

window.location.replace("c.html");

window.location.replace(url) replaces the current location in the address bar by a new one. The page that was calling the function, won’t be included in the browser history. Therefore, on the new location, clicking the back button in your browser would make you go back to the page you were viewing before you visited the document containing the redirecting JavaScript.

window.location.replace(url) 将目前浏览器的地址替换掉,调用这个方法的网页,将不会被写入浏览记录。所以,网页 b 不会被写入浏览记录,从网页 a 经过 b 跳转到 c,再点击返回按钮将跳转到 a.

  • 11
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值