带有锚的查询字符串的javascript正则表达式答案

【问题标题】：javascript regex for querysting with anchor带有锚的查询字符串的javascript正则表达式
【发布时间】：2015-10-23 18:56:01
【问题描述】：

我正在制作一个具有多个“页面”的 Web 应用程序，但它们都将在客户端加载。看起来它在技术上是如何在同一页面上的，我将在 # 之后使用参数来跟踪当前页面状态，同时防止回发。我的问题是我似乎无法使用正则表达式行选择所有参数。当我在线使用测试工具时，拆分的正则表达式有效，但在我的网页上使用它时无效。

//Test data for url
//https://test.ca?hi&hey=3&test=oh+hi+mark#edit&e=1

var split = /([^&#=]+)=?([^&#]*)/g;
var url = window.location.href;
var match = split.exec(url);

//this outputs match with a length of three 
//[0] = 'https://test.ca?hi'
//[1] = 'https://test.ca?hi'
//[2] = ''

我认为这应该是一个已解决的问题，但我似乎找不到答案。我想这会导致另一个问题。我这样做是不是完全错误的方式？

【问题讨论】：

标签： javascript regex testing anchor query-string

【解决方案1】：

您使用的正则表达式错误。您只需打印整个匹配项，而您需要在遍历 1 个字符串中的所有匹配项时访问捕获的组。

这里是一个例子 sn-p:

var re = /([^&#=]+)=?([^&#]*)/g; 
var str = 'https://test.ca?hi&hey=3&test=oh+hi+mark#edit&e=1';
var match;
 
while ((match = re.exec(str)) !== null) {
    document.write(match[1] + "<br/>" + match[2] + "<br/><br/>");
}

请注意，第一个匹配项是 URL 的“主要”部分。后续匹配是参数值对。

【讨论】：

这个循环是我所缺少的，我现在看到它是如何遍历每组值的。感谢您的及时回复。

【解决方案2】：

尝试改用 window.location.hash。它将返回哈希值（在您的示例 url 中为 #edit&e=1），您可以使用字符串操作来执行您需要的任何操作。

【讨论】：