如何在JS中获取URL中的#哈希值

Question

例如，我有一个URL地址：

http://www.google.com/#hash=value2x

我想要一段JS代码只返回value2x。 我尝试过location.hash.split('=')[1]但是会返回第一个哈希值，就像如果url是这样的：

http://www.google.com/#hfh=fdg&hash=value2x

它会返回fdg&hash。 我只想要hash的值。

请勿使用jQuery。

提前感谢您的帮助。

- Akshat Mittal

Answer 1

function getHashValue(key) {
  var matches = location.hash.match(new RegExp(key+'=([^&]*)'));
  return matches ? matches[1] : null;
}

// usage
var hash = getHashValue('hash');

- xdazz

---

这将返回hash=之后的所有内容。 - Akshat Mittal

需要注意的是，如果没有哈希或者键不存在，这将导致错误。这是一个更加安全的答案版本。 - Hectron

@xdazz: 正如Hectron所说，如果没有哈希，则会引发类型错误，因此您应该检查match方法返回的数组的长度，并且仅在其长度大于或等于2时索引此数组。 如果不是，则应返回空字符串或null（或未定义）。 - Sk8erPeter

需要注意的是，“key”将被RegEx解析器解释，因此如果有一个包含点或单个大括号的合法键，则会导致与预期不同甚至错误的结果。 - Florian Loch

应该这样修正： 返回 matches && matches.length === 2 ? matches[1] : null； - GhostCKY

Answer 2

可以重复使用URLSearchParams类来实现此目的。

var urlParams = new URLSearchParams(window.location.hash.replace("#","?"));
var hash = urlParams.get('hash');

- nishantkyal

---

你也可以使用 window.location.hash.slice(1)。 - Wong Jia Hau

那段代码是错误的。不应该用"?"替换"#"，而应该将"#"删除。因此，将replace("#","?")替换为slice(1)。 - Clox

@Clox 嗯，不是这样的。那样只会将哈希部分中的第一个键与参数部分中的最后一个值合并，或者与路径合并。如果没有 URL 参数，则必须用 ? 替换 #；如果已经有参数，则必须用 & 替换 #。但无论如何，这都是一种不好的方法，因为你也会提取 URL 参数。 - B T

Answer 3

如何呢？

location.hash.split('hash=')[1].split('&')[0]

这将把哈希值拆分为hash =，并提取在hash=之后以及任何其他参数之前的值。

- Musa

---

这个代码本身是不起作用的，但是将它改为 location.href.split('hash=')[1].split('&')[0] 就可以正常工作了。 - Akshat Mittal

需要进行更多测试，现在点赞。 - Akshat Mittal

Answer 4

location.parseHash = function(){
   var hash = (this.hash ||'').replace(/^#/,'').split('&'),
       parsed = {};

   for(var i =0,el;i<hash.length; i++ ){
        el=hash[i].split('=')
        parsed[el[0]] = el[1];
   }
   return parsed;
};

var obj= location.parseHash();
    obj.hash;  //fdg 
    obj.hfh;   //value2x

- abuduba

Answer 5

如果URL中有?，代码可能是：http://www.google.com/#?hash=value2x 代码可以是：

const url = 'http://www.google.com/#?hash=value2x';
new URLSearchParams(
  (
    new URL(url)
  ).hash.slice(1).split('?')[1]
).get('hash');

如果url没有?：

const url = 'http://www.google.com/#hash=value2x';
(new URLSearchParams((new URL(url)).hash.slice(1))).get('hash')

- user3713526

Answer 6

先按&分割，再按=分割：

pairs = location.hash.substr(1).split('&').map(function(pair) {
    var kv = pair.split('=', 2);
    return [decodeURIComponent(kv[0]), kv.length === 2 ? decodeURIComponent(kv[1]) : null];
})

这里的 pairs 将是一个数组的数组，其中关键字在 0 位置，值在 1 位置：

[["hfh","fdg"],["hash","value2x"]]

- Gumbo

Answer 7

如果您正在进行大量的URL操作，那么您应该查看JQuery URL插件。

访问URL哈希中的参数。

    $.url('http://www.google.com/#hfh=fdg&hash=value2x').fparam('hash');

或者如果它的当前URL

    $.url().fparam('hash');

希望能有所帮助

- RameshVel

---

这很有帮助，我以前也知道这个，抱歉之前没有说明，但我不想使用jQuery。 - Akshat Mittal