首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >window.location.href、window.location.replace和window.location.assign的区别

window.location.href、window.location.replace和window.location.assign的区别
EN

Stack Overflow用户
提问于 2011-10-09 21:04:57
回答 3查看 123.3K关注 0票数 153

它们之间的区别是什么

  1. window.location.href="http://example.com";
  2. window.location.replace("http://example.com");
  3. window.location.assign("http://example.com");

我在许多论坛上看到,window.location.assign()只是替换了当前的会话历史,因此浏览器的后退按钮将不起作用。然而,我无法重现这一点。

代码语言:javascript
复制
function fnSetVariable() {
    //window.location.href = "http://example.com";
    window.location.replace("http://example.com");
    //window.location.assign("http://example.com");
}

<a onmouseover="fnSetVariable();" 
   href="PageCachingByParam.aspx?id=12" >
   CLICK 
</a>
EN

回答 3

Stack Overflow用户

发布于 2011-10-09 21:11:30

它们做的是相同的事情:

代码语言:javascript
复制
window.location.assign(url);
window.location = url;
window.location.href = url;

它们只需导航到新的URL。另一方面,replace方法导航到该网址,而不向历史记录中添加新记录。

所以,你在那些论坛上读到的是不正确的。assign方法确实向历史记录中添加了一条新记录。

参考:https://developer.mozilla.org/en-US/docs/Web/API/Window/location

票数 193
EN

Stack Overflow用户

发布于 2012-04-24 07:17:31

关于不能使用后退按钮的部分是一个常见的误解。Window.location.replace从页面历史列表中剔除前一个条目,用新的条目覆盖它,这样用户就不能很容易地返回到那个特定的网页。该函数不会清除整个页面历史记录列表,也不会使后退按钮完全失效。

(据我所知,没有任何函数或参数组合可以更改或覆盖您在某些情况下不是绝对拥有的历史列表条目-浏览器通常通过简单地不定义任何可能影响页面历史列表顶部条目以外的任何条目的操作来实现此安全限制。我不寒而栗地想,如果存在这样的功能,恶意软件可能会做什么卑劣的事情。)

如果你真的想让后退按钮不起作用(可能不是“用户友好的”:如果这真的是你想做的,再想一想),“打开”一个全新的窗口。(你可以“打开”一个甚至没有“后退”按钮的弹出窗口,因为现在...but弹出窗口并不是很流行:-)如果你想保持你的页面显示,不管用户做什么(再说一次,“用户友好性”是有问题的),设置一个window.onunload处理程序,每次重新加载你的页面,从一开始就清楚了。

票数 16
EN

Stack Overflow用户

发布于 2021-04-24 17:22:28

上面的答案清楚地说明了location.replacelocation.href之间的区别。然而,我想补充一个我在使用React时遇到的location.assignlocation.href用法的显著区别。

在React中分析以下代码段:

代码语言:javascript
复制
return (<>location.href = "www://example.com"</>)

Vs

return (<>location.assign("www://example.com")</>)

在fonmer示例中,您实际上会看到字符串www://example.com在DOM上输入了一瞬间,因为它会在重定向发生之前呈现文本。

为了避免这种情况,我们需要使用后一种location.assign()

票数 -1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/7703689

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档