Location.href、 window.location.place 和 window.location.sign 之间的区别

有什么区别

  1. window.location.href="http://example.com";
  2. window.location.replace("http://example.com");
  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>
137698 次浏览
小开

它们的作用是一样的:

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

小开

关于不能使用 Back 按钮的部分是一个常见的误解。Place (URL)将 头儿 ONE 条目从页面历史列表中删除，方法是用新条目覆盖它，这样用户就不能轻易返回到那个特定的网页。该函数不会清除 完整的页面历史列表，也不会使后退按钮完全失效。

(据我所知，没有任何函数或参数组合可以改变或覆盖 你不完全拥有的历史记录列表条目——浏览器通常通过简单地不定义任何操作来实现这种安全限制，这些操作可能完全影响页面历史记录列表中除 头儿以外的任何条目。我不敢想象，如果存在这样的功能，恶意软件会做出什么卑鄙的事情。)

如果你真的想让后退按钮不起作用(可能不是“用户友好”: 再想想如果这是 真的你想做的) ，“打开”一个全新的窗口。(你可以“打开”一个弹出窗口，甚至没有 有一个“返回”按钮... 但弹出窗口不是很流行这些天: ——如果你想保持你的页面显示，无论用户做什么(再次“用户友好性”是值得怀疑的) ，设置一个 window.onunload 处理程序，只是重新加载你的页面，从一开始每次清除。

小开

上面的答案清楚地说明了 location.replace和 location.href之间的区别。然而，我想补充一个值得注意的差异，我在使用 location.assign和 location.href时遇到的反应。

在 React 中分析以下代码片段:

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

V

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

在 fonmer 的情况下，您实际上会看到字符串 Www://example.com在 DOM 上被键入了一瞬间，因为它在重定向发生之前呈现了文本。

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


提交答案