更改链接 URL 中的路径名，同时保持查询字符串不变答案

【问题标题】：Change the pathname in the URL of a link while keeping the querystring constant更改链接 URL 中的路径名，同时保持查询字符串不变
【发布时间】：2014-01-06 23:27:08
【问题描述】：

我想从具有以下 URL http://example.com/foo.html?query=1&other=2 的页面创建指向 http://example.com/bar.html?query=1&other=2 的链接。如何在不显式保存和重新加载所有查询字符串的情况下做到这一点。

我需要它来轻松地从页面的 iframe 版本 (embed.html?query) 链接到完整页面 (index.html?query)。

【问题讨论】：

你说“我要创建链接”是什么意思？
我需要一个锚<a href="...">Full page</a>

标签： javascript html url query-string href

【解决方案1】：

我会建议使用Location object 的search 方法（可在document.location 或window.location 获得）提取参数，然后修改URL 的其余部分，但该API 显然特定于火狐。

我会简化@DMortensen 的答案，只需拆分第一个?，然后修改第一部分（这将只是URL 的路径部分），然后重新应用第二部分。

如果需要解析参数，我推荐jQuery插件Query Parameter Parser：一次调用$.parseQuery(s)会拉出一个包含所有键值的对象。

【讨论】：

感谢您的所有回答。我尝试了以下方法，它可以工作。 function gotoFullSite() { var search = window.location.search; window.open("http://example.com/"+search) } $('#clickable').click(gotoFullSite); 和使用 <a id = "clickable" href="#"></a>。当我单击该链接时，它会在新选项卡中打开包含所有查询参数的正确网站。（我需要一个新标签来跳出嵌入页面所在的iframe。）

【解决方案2】：

它可能很挑剔，但您可以将 URI 拆分为“？”然后遍历该数组的第二个元素以获取 key/val 对，如果您需要评估每一对（使用 '&' 作为分隔符）。明显的弱点是如果有额外的“？”或 URI 中使用的“&”。

可能是这样的？（伪代码）

var URI = document.URL;
var qs = URI.split('?');
var keyvalpair = qs[1].split('&');
var reconstructedURI = '&' + keyvalpair;
for(var i = 0; i< keyvalpair.length; i++){
    var key = keyvalpair[i].split('=')[0];
    var val = keyvalpair[i].split('=')[1];
}

【讨论】：

【解决方案3】：

感谢您的所有回答。我尝试了以下方法，它可以工作。

function gotoFullSite() {
    var search = window.location.search;
    window.open("http://example.com/"+search)
}
$('#clickable').click(gotoFullSite);

然后使用<a id = "clickable" href="#"></a>。当我单击该链接时，它会在新选项卡中打开包含所有查询参数的正确网站。（我需要一个新标签来跳出iframe。）

【讨论】：