如何在不刷新页面的情况下使用JavaScript从window.location（URL）中删除哈希？

javascript fragment-identifier window.location

2022-08-29 23:27:35

我有这样的URL：，如何删除，而不会导致页面刷新？http://example.com#something#something

我尝试了以下解决方案：

window.location.hash = '';

但是，这不会从 URL 中删除哈希符号 # 。

答案 1

如今，解决这个问题更加触手可及。HTML5历史API允许我们操纵地址栏以显示当前域中的任何URL。

function removeHash () { 
    history.pushState("", document.title, window.location.pathname
                                                       + window.location.search);
}

工作演示：http://jsfiddle.net/AndyE/ycmPt/show/

这适用于Chrome 9，Firefox 4，Safari 5，Opera 11.50和IE 10。对于不受支持的浏览器，您始终可以编写一个优雅的降级脚本，以便在可用的情况下使用它：

function removeHash () { 
    var scrollV, scrollH, loc = window.location;
    if ("pushState" in history)
        history.pushState("", document.title, loc.pathname + loc.search);
    else {
        // Prevent scrolling by storing the page's current scroll offset
        scrollV = document.body.scrollTop;
        scrollH = document.body.scrollLeft;

        loc.hash = "";

        // Restore the scroll offset, should be flicker free
        document.body.scrollTop = scrollV;
        document.body.scrollLeft = scrollH;
    }
}

因此，您可以摆脱哈希符号，只是尚未在所有浏览器中使用。

_{注意：如果要替换浏览器历史记录中的当前页面，请使用replaceState（）而不是pushState（）。。}

答案 2

初始问题：

window.location.href.substr(0, window.location.href.indexOf('#'))

或

window.location.href.split('#')[0]

两者都将返回没有哈希或其后任何内容的URL。

关于您的编辑：

任何更改都将触发页面刷新。您可以在不触发刷新的情况下进行更改（尽管如果您的哈希与页面上的 ID 匹配，窗口将跳转），但您无法摆脱哈希符号。选择哪个更糟...window.locationwindow.location.hash

最新答案

关于如何在不牺牲（完全重新加载或将哈希符号留在那里）的情况下做到这一点的正确答案就在这里。把这个答案留在这里，尽管是关于2009年的原始答案，而利用新浏览器API的正确答案是在1.5年后给出的。