我应该使用哪个JavaScript库来解析URL参数?

10

如何在JavaScript中解析URL参数?(这些参数通常被称为GET参数或CGI参数,但在这种情况下,页面基本上是向自身提交而不是服务器,因此没有GET请求,也绝对没有CGI程序。)

我在网上看到了很多可以复制的例程,但我不知道它们有多健壮。我习惯于像Perl和Java这样的其他语言,我可以依靠经过严格测试和强大的库来处理标准中的数百万个边缘情况。我希望在这里也能有相同的事情,而不仅仅是剪切和粘贴一个示例。


你期望使用简单的GET数据有多少“边缘情况”?! - Josh Stodola
1
乔希 - 就像 Skip 说的,有数百万个小东西。 - Andy Gaskell
9个回答

5

1
我本想选择这条路线,但今天学习和实现起来太过繁琐。对于那些有足够能力并能处理jQuery框架开销的人来说,这是我首选的答案。 - skiphoppy
2
"jQuery URL解析器。"链接已损坏。 - Ronen Ness

2
以下是两个简单的函数,可以完成此任务:http://adamv.com/dev/javascript/querystring 以下是API参考示例:
var qs = new Querystring();

// Parse a given querystring
var qs2 = new Querystring("name1=value1&name2=value2");

var v1 = qs2.get("name1");
var v3 = qs2.get("name3", "default value");

谢谢。这很轻量级和简单,但仍然实现了我想要的:一个库,而不是要复制的示例。我想使用JQuery,但今天似乎无法弄清楚,所以那将得等到另一个时间。 - skiphoppy
我发布这些内容的原因是因为你不需要整个框架来管理如此简单的任务,所以不需要jQuery。 - Andreas Grech
2
是的,今天不必依赖整个框架真是太好了。 - skiphoppy
提供的链接已失效。 - Christos Batzilis
1
@ChristosBatzilis 毫不奇怪,因为它是在大约12年前发布的。我现在已经更新了链接,改用Wayback机器。 - Andreas Grech

1
我使用这里提供的parseUri库: http://stevenlevithan.com/demo/parseuri/js/ 它可以让你做到你所要求的一切:
var uri = 'http://google.com/?q=stackoverflow';
var q = uri.queryKey['q'];
// q = 'stackoverflow'

我已经使用它一段时间了,到目前为止还没有遇到任何问题。


1

jsUri的浏览器兼容性如何? - tk_

1

如果是“提交给自己”,你需要使用GET参数吗?

但是,如果你需要使用GET参数,现在大多数浏览器都有decodeURIComponent函数来处理单个参数;你的任务是在&符号上分割它们(String#split可以很好地完成这项工作)。如果你想要一个库,jQuery和Prototype都被广泛使用和测试过。


1
我发现最好的方法是自己动手,将参数导入全局键/值对象中。
获取查询参数很简单...
只需要使用一些.split()函数即可。
var myquery = thewholeurl.split("?")[1]; //will get the whole querystring with the ?

然后你可以执行

myparams = myquery.split("&")

然后你可以执行

for each param in myparams
{
temp = param.split("=");

mykeys.push(temp[0]);
myvalues.push(temp[1]);

OR

myObject[temp[0]] = temp[1];
}

这只是风格问题。

这不是完美的代码,只是伪代码,让你有个想法。


如果你这样做,你需要将键和值都通过decodeURIComponent运行。 - T.J. Crowder

0

我推荐使用query-string

安装:

npm install query-string

用法:

import queryString from 'query-string';

console.log(location.search);
//=> '?foo=bar'

const parsed = queryString.parse(location.search);
console.log(parsed);
//=> {foo: 'bar'}

parsed.foo = 'unicorn';
parsed.ilike = 'pizza';

const stringified = queryString.stringify(parsed);
//=> 'foo=unicorn&ilike=pizza'

location.search = stringified;
// note that `location.search` automatically prepends a question mark
console.log(location.search);
//=> '?foo=unicorn&ilike=pizza'

https://www.npmjs.com/package/query-string


0

我认为这个库非常适用,它是独立的,因此您可以将其与JQuery、YAHOO或Dojo一起使用,另一个优点是它有相当完善的文档。

http://www.openjsan.org/doc/t/th/theory/HTTP/Query/0.03/lib/HTTP/Query.html

在这种情况下,您可以使用HTTP.Query来为您完成所有工作。它只有1.2 KB压缩,因此如果需要,您甚至可以将其包含在更大的库中。


-1

Javascript没有内置的URL参数支持。

不过,location.search属性返回当前页面URL从问号(“?”)开始的部分。

通过这个,你可以编写自己的参数解析器,或者你可以利用大多数常见Javascript框架中提供的其中之一,比如JQuery和类似的框架。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接