用js修改URL参数的最佳方法

时间:2018-07-31 21:04:52

标签: javascript jquery url-modification

我试图修改URL参数,但是找不到完美的方法。

首先我尝试过:

window.location.href = window.location.href + '?test';

问题在于,页面会重新加载,并且只是添加到了网址中。

然后我尝试了:

window.location.href = String( window.location.href ).replace( "?test", "" );

这很完美,我要替换的部分被替换/删除,但是页面每次都会重新加载...

然后我了解到:

window.history.pushState( {} , 'test', '?test' );

但这不起作用...

我的目的是在单击按钮以控制功能时添加和替换/删除URL字符串。

例如 网址为http://www.example.com/?showoverlay&?showhint

因此,例如,这显示了基于这些URL参数的覆盖和提示工具提示。 当用户关闭覆盖图时,应在不重新加载页面的情况下删除“ showoverlay”部分。因此,URL为:

http://www.example.com/?showhint

1 个答案:

答案 0 :(得分:0)

您是否尝试过使用replaceState?它取代了历史记录而无需重新加载页面,并且可能适合您的用例。

window.history.replaceState(data, title [, url  ] );

https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_replaceState()_method

如果您需要保留网址的其他部分,请确保将其存储在单独的变量中,并将其附加回网址中。

大致可以通过以下方法获取网址的每个部分:

let url = window.location.origin + window.location.pathname + window.location.search

然后您只需使用

将其添加回去
window.history.replaceState({}, '', url + '&yourNewParameters=value')