logo标签列表

JavaScript查询字符串

javascriptquery-string
106

是否有任何JavaScript库可以像ASP.NET一样将查询字符串转换成字典？

类似以下的用法：

var query = window.location.querystring["query"]?

在.NET领域之外，“查询字符串”是否被称为其他名称？为什么不将location.search拆分为“键/值集合”？

编辑：我已经编写了自己的函数，但是否有任何主要的JavaScript库可以执行此操作？

3
我可以翻译该网址的内容：http://medialize.github.com/URI.js/该网址提供了一个 URI.js 库，它是用于解析、操作和生成统一资源标识符（URI）的 JavaScript 库。这个库可以帮助开发者处理 URL 中的各种参数、片段、路径等元素，并轻松地构建自定义的 URI。 - deerchao
请参阅如何获取查询字符串的值？。 - Bergi
非常重复：https://dev59.com/nHNA5IYBdhLWcg3wmfAa和https://dev59.com/nHNA5IYBdhLWcg3wmfAa - DavidTaubmann
1
@davidtaubmann那个更老，它会是相反的。有趣的是，它们本质上是在问同样的问题，但由于问题的格式，一个得到了社区关注，而另一个则被关闭了。 - Andre Figueiredo
15个回答
1

我为类似这样的需求编写了一个使用纯JavaScript字符串操作的函数。

"http://www.google.lk/?Name=John&Age=20&Gender=Male"

function queryize(sampleurl){
    var tokens = url.split('?')[1].split('&');
    var result = {};

    for(var i=0; i<tokens.length; i++){
        result[tokens[i].split('=')[0]] = tokens[i].split('=')[1];
    }

    return result;
}

使用方法：

queryize(window.location.href)['Name'] //returns John
queryize(window.location.href)['Age'] //returns 20
queryize(window.location.href)['Gender'] //returns Male
很整洁，但除了你删除前导?的方式外，基本上与你之前两个答案相同？ - Rup
只是一个小改进。 方法的使用方式使用户很容易上手。用户只需要知道他需要什么查询字符串值即可。 - Pranavan Maru
1

我喜欢保持简单、易读和精简。

function searchToObject(search) {
    var pairs = search.substring(1).split("&"),
        obj = {}, pair;

    for (var i in pairs) {
        if (pairs[i] === "") continue;
        pair = pairs[i].split("=");
        obj[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
    }
    return obj;
}

searchToObject(location.search);

示例：

searchToObject('?query=myvalue')['query']; // spits out: 'myvalue'
1
如果您正在使用lodash + ES6，这里有一个一行解决方案: _.object(window.location.search.replace(/(^\?)/, '').split('&').map(keyVal => keyVal.split('=')));
0

好的，既然大家都忽略了我的实际问题，呵呵，我也来发一个！这是我拥有的：

location.querystring = (function() {

    // The return is a collection of key/value pairs

    var queryStringDictionary = {};

    // Gets the query string, starts with '?'

    var querystring = unescape(location.search);

    // document.location.search is empty if no query string

    if (!querystring) {
        return {};
    }

    // Remove the '?' via substring(1)

    querystring = querystring.substring(1);

    // '&' seperates key/value pairs

    var pairs = querystring.split("&");

    // Load the key/values of the return collection

    for (var i = 0; i < pairs.length; i++) {
        var keyValuePair = pairs[i].split("=");
        queryStringDictionary[keyValuePair[0]] = keyValuePair[1];
    }

    // Return the key/value pairs concatenated

    queryStringDictionary.toString = function() {

        if (queryStringDictionary.length == 0) {
            return "";
        }

        var toString = "?";

        for (var key in queryStringDictionary) {
            toString += key + "=" + queryStringDictionary[key];
        }

        return toString;
    };

    // Return the key/value dictionary

    return queryStringDictionary;
})();

还有测试：

alert(window.location.querystring.toString());

for (var key in location.querystring) {
    alert(key + "=" + location.querystring[key]);
}

话说，JavaScript并不是我的母语。

无论如何，我正在寻找一个已经编写好的JavaScript库（例如jQuery、Prototype）。

1
我不确定你真的需要一个库来完成上面相当于三行代码的工作！不过，至少你希望一个库能够记住decodeURIComponent()的键和值，迄今为止发布的每个代码片段都没有做到这一点。 - bobince
你不需要使用库。我想将我的实现与库中的实现进行比较，以便查看是否遗漏了任何边缘情况。 :) - core
JavaScript 不是你的母语，这意味着什么？即使你需要使用库，你也应该学习它。 - Marwan
0
基于@CMS的答案，我有以下内容（使用CoffeeScript编写，可以轻松转换为JavaScript）：
String::to_query = ->
  [result, re, d] = [{}, /([^&=]+)=([^&]*)/g, decodeURIComponent]
  while match = re.exec(if @.match /^\?/ then @.substring(1) else @)
    result[d(match[1])] = d match[2] 
  result

你可以轻松使用以下方法来获取你需要的内容：

location.search.to_query()['my_param']

这里的优势是面向对象的接口（而不是函数式的），并且它可以在任何字符串上执行（而不仅仅是location.search）。

如果您已经在使用JavaScript库，则此函数可能已经存在。例如，这里是Prototype的版本。

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