使用 javascript 读取/操作查询字符串参数的最简单方法是什么？答案

【问题标题】：What is the easiest way to read/manipulate query string params using javascript?使用 javascript 读取/操作查询字符串参数的最简单方法是什么？
【发布时间】：2010-09-14 02:31:08
【问题描述】：

我在网上看到的示例似乎比我预期的要复杂得多（手动将 &/?/= 解析成对，使用正则表达式等）。我们使用的是 asp.net ajax （在他们的客户端参考中看不到任何内容），如果真的有帮助，会考虑添加 jQuery。

我认为那里有一个更优雅的解决方案 - 到目前为止 this is the best code I've found 但我很想找到更多类似 HttpRequest.QueryString 对象的内容（asp.net 服务器端）。提前致谢，

肖恩

【问题讨论】：

How can I get query string values?的可能重复
Change URL parameters的可能重复

标签： javascript query-string

【解决方案1】：

确实有一个QueryString plugin 用于 jQuery，如果你愿意安装 jQuery 核心和插件，它可能会很有用。

【讨论】：

经过一些工作，我们正在慢慢地将我们的 asp.net 应用程序移植到 jquery。该库给我们留下了深刻的印象，并且很快将由 Microsoft 分发，因此如果您遇到类似的 JS 问题/问题，我建议您查看 jQuery
一年多过去了——我们双脚进入 jquery，我们强烈推荐它用于解析查询字符串或任何客户端任务

【解决方案2】：

看看我的帖子，它会告诉你如何做到这一点：

http://seattlesoftware.wordpress.com/2008/01/16/javascript-query-string/

【讨论】：

+1 因为它不使用任何第 3 方库，有时您无法导入它们（例如，在处理小部件/小工具时）。

【解决方案3】：

使用来自prototypejs.org 的String 实用程序，称为toQueryParams()。

来自他们网站的示例：http://prototypejs.org/api/string/toQueryParams

'section=blog&id=45'.toQueryParams();
// -> {section: 'blog', id: '45'}

'section=blog;id=45'.toQueryParams();
// -> {section: 'blog', id: '45'}

'http://www.example.com?section=blog&id=45#comments'.toQueryParams();
// -> {section: 'blog', id: '45'}

'section=blog&tag=javascript&tag=prototype&tag=doc'.toQueryParams();
// -> {section: 'blog', tag: ['javascript', 'prototype', 'doc']}

'tag=ruby%20on%20rails'.toQueryParams();
// -> {tag: 'ruby on rails'}

'id=45&raw'.toQueryParams();
// -> {id: '45', raw: undefined}

另外，您可以使用别名 parseQuery() 来获得相同的结果。

window.location.search.parseQuery();

由于window.location返回的是对象，所以必须获取字符串。

【讨论】：

【解决方案4】：

对于 jQuery，我建议 jQuery BBQ: Back Button & Query Library By "Cowboy" Ben Alman

jQuery BBQ 利用 HTML5 hashchange 事件允许简单但强大的书签#hash 历史。此外，jQuery BBQ 提供了一个完整的 .deparam() 方法，以及哈希状态管理和片段/查询字符串解析和合并实用程序方法。

例子：

// Parse URL, deserializing query string into an object.
// http://www.example.com/foo.php?a=1&b=2&c=hello#test
// search is set to ?a=1&b=2&c=hello
// myObj is set to { a:"1", b:"2", c:"hello" }
var search = window.location.search;
var myObj = $.deparam.querystring( search );

【讨论】：

【解决方案5】：

如果我不想使用插件，我正在使用此功能：

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (pair[0] == variable) {
            return pair[1];
        }
    }
    return null;
}

【讨论】：

正是我所需要的。谢谢:)

【解决方案6】：

  *$(document).ready(function () {
            $("#a").click(function () {
                window.location.href = "secondpage.aspx?id='0' & name='sunil'& add='asr' & phone='1234'";
            });
        });*


**then read the query string parameters on another using split method . Here as follows:**


  *$(document).ready(function () {
            var a = decodeURI(window.location.search);
            var id = window.location.search = "id=" + $().val();
            var name = a.split("name=")[1].split("&")[0].split("'")[1];
            var phone = a.split("phone=")[1].split("&")[0].split("'")[1];
            var add = a.split("add=")[1].split("&")[0].split("'")[1];
            alert(id+','+name+','+add+','+phone); 
        });*

【讨论】：

【解决方案7】：

如果有可能遇到重复的参数（例如 ?tag=foo&tag=bar），那么大多数库都不够用。在这种情况下，您可能需要考虑我从 Jan Wolter 的 very comprehensive parser 开发的这个库。我添加了 .plus() 和 .minus() 函数和往返：

https://github.com/timmc/js-tools/blob/master/src/QueryString.js

【讨论】：