JavaScript 中的 window.location.href 与 window.location.replace 与 window.location.assign

Question

之间有什么区别

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

我在许多论坛上读到 window.location.assign() 只是替换了当前的会话历史记录和浏览器的后退按钮将不起作用。但是，我无法重现这一点。

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>

Answer 1

它们做同样的事情：

window.location.assign(url);
window.location = url;
window.location.href = url;

它们只是导航到新的 URL。另一方面，replace 方法导航到 URL，而不向历史记录添加新记录。

所以，你在这么多论坛上读到的内容都是不正确的。 assign 方法确实向历史记录中添加了一条新记录。

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

Answer 2

关于无法使用“后退”按钮的部分是一种常见的误解。 window.location.replace(URL) 通过用新条目覆盖它，从页面历史记录列表中抛出top 一个条目，这样用户就无法轻松返回到该特定网页。该功能不会清除整个页面历史列表，也不会使“后退”按钮完全不起作用。

（据我所知，没有任何函数或参数组合可以更改或覆盖您绝对不拥有的历史列表条目 - 浏览器通常通过简单地不定义任何可能的操作来实现此安全限制根本不会影响页面历史记录列表中除顶部之外的任何条目，如果存在这样的功能，我不禁想到恶意软件可能会做出什么样的卑鄙事情。

）按钮不起作用（可能不是“用户友好”：再想一下这是否真的是你想做的），“打开”一个全新的窗口。 （您可以“打开”一个甚至没有“后退”按钮的弹出窗口...但是弹出窗口现在不太流行:-)如果您想保持页面显示无论用户做什么（再次“用户友好性”是有问题的），设置一个 window.onunload 处理程序，每次都从头开始重新加载您的页面。

Answer 3

位置，location.href 和 location.assign() 可以转到添加以下内容的 URL记录到历史记录，以便我们可以返回上一页：

location = "http://example.com";
location.href = "http://example.com";
location.assign("http://example.com");

location.replace() 可以转到不将记录添加到历史记录中的 URL，因此我们无法返回到上一页：

location.replace("http://example.com");