Có thư viện JavaScript nào tạo từ điển ngoài chuỗi truy vấn, ASP.NETkiểu không?

Một cái gì đó có thể được sử dụng như:

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

Là "chuỗi truy vấn" được gọi là cái gì khác ngoài .NETlĩnh vực? Tại sao không được location.searchchia thành một bộ sưu tập khóa / giá trị ?

CHỈNH SỬA : Tôi đã viết hàm của riêng mình, nhưng có thư viện JavaScript chính nào làm được điều này không?

Có thể là http://plugins.jquery.com/query-object/ ?

Đây là nhánh của nó https://github.com/sousk/jquery.parsequery#readme .

Bạn có thể trích xuất các cặp khóa / giá trị từ thuộc tính location.search , thuộc tính này có một phần của URL theo sau dấu? biểu tượng, bao gồm dấu? Biểu tượng.

function getQueryString() {
  var result = {}, queryString = location.search.slice(1),
      re = /([^&=]+)=([^&]*)/g, m;

  while (m = re.exec(queryString)) {
    result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
  }

  return result;
}

// ...
var myParam = getQueryString()["myParam"];

giải pháp tl; dr trên một dòng mã (ish) duy nhất sử dụng javascript vani

var queryDict = {}
location.search.substr(1).split("&").forEach(function(item) {
    queryDict[item.split("=")[0]] = item.split("=")[1]
})

Đối với chuỗi truy vấn, ?a=1&b=2&c=3&d&enó trả về:

> queryDict
a: "1"
b: "2"
c: "3"
d: undefined
e: undefined

khóa đa giá trị và các ký tự được mã hóa ?

Xem câu trả lời ban đầu tại Làm cách nào để nhận giá trị chuỗi truy vấn trong JavaScript?

"?a=1&b=2&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> queryDict
a: ["1", "5", "t e x t"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

Sau khi tìm thấy bài đăng này, khi nhìn lại bản thân, tôi nghĩ mình nên nói thêm rằng tôi không nghĩ giải pháp được nhiều người bình chọn nhất là tốt nhất. Nó không xử lý các giá trị mảng (chẳng hạn như? A = foo & a = bar - trong trường hợp này, tôi mong đợi nhận được một để trả về ['foo', 'bar']). Theo như tôi có thể nói thì không tính đến các giá trị được mã hóa - chẳng hạn như mã hóa ký tự hex trong đó% 20 đại diện cho một khoảng trắng (ví dụ:? A = Hello% 20World) hoặc biểu tượng dấu cộng được sử dụng để đại diện cho một khoảng trắng (ví dụ :? a = Hello + World).

Node.js cung cấp một giải pháp hoàn chỉnh để phân tích cú pháp chuỗi truy vấn. Nó sẽ dễ dàng lấy ra và sử dụng trong dự án của riêng bạn vì nó được cách ly khá tốt và được cấp phép dễ dàng.

Bạn có thể xem mã của nó tại đây: https://github.com/joyent/node/blob/master/lib/querystring.js

Các bài kiểm tra mà Node có có thể được xem tại đây: https://github.com/joyent/node/blob/master/test/simple/test-querystring.js Tôi khuyên bạn nên thử một số bài kiểm tra này với câu trả lời phổ biến để xem nó như thế nào. xử lý chúng.

Ngoài ra còn có một dự án mà tôi đã tham gia để đặc biệt thêm chức năng này. Nó là một cổng của mô-đun phân tích chuỗi truy vấn lib tiêu chuẩn Python. Bạn có thể tìm thấy fork của tôi tại đây: https://github.com/d0ugal/jquery.qeeree

Hoặc bạn có thể sử dụng thư viện sugar.js .

Từ sugarjs.com:

Object.fromQueryString (str , deep = true )

Chuyển đổi chuỗi truy vấn của một URL thành một đối tượng. Nếu deep là false, chuyển đổi sẽ chỉ chấp nhận các tham số nông (tức là không có đối tượng hoặc mảng có cú pháp []) vì chúng không được hỗ trợ phổ biến.

Object.fromQueryString('foo=bar&broken=wear') >{"foo":"bar","broken":"wear"}
Object.fromQueryString('foo[]=1&foo[]=2') >{"foo":[1,2]}

Thí dụ:

var queryString = Object.fromQueryString(location.search);
var foo = queryString.foo;

Nếu bạn có sẵn chuỗi truy vấn, hãy sử dụng:

 /**
 * @param qry the querystring
 * @param name name of parameter
 * @returns the parameter specified by name
 * @author eduardo.medeirospereira@gmail.com
 */

function getQueryStringParameter(qry,name){
    if(typeof qry !== undefined && qry !== ""){
        var keyValueArray = qry.split("&");
        for ( var i = 0; i < keyValueArray.length; i++) {
            if(keyValueArray[i].indexOf(name)>-1){
                return keyValueArray[i].split("=")[1];
            }
        }
    }
    return "";
}

// How about this
function queryString(qs) {
    var queryStr = qs.substr(1).split("&"),obj={};
    for(var i=0; i < queryStr.length;i++)
        obj[queryStr[i].split("=")[0]] = queryStr[i].split("=")[1];
    return obj;
}

// Usage:
var result = queryString(location.search);

Điều đáng chú ý, thư viện mà John Slegers đề cập có phụ thuộc jQuery, tuy nhiên đây là một phiên bản là vanilla Javascript.

https://github.com/EldonMcGuinness/querystring.js

Tôi chỉ đơn giản là bình luận về bài đăng của anh ấy, nhưng tôi không có danh tiếng để làm như vậy. : /

Thí dụ:

Ví dụ dưới đây xử lý chuỗi truy vấn sau, mặc dù không đều,:

?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab 

var qs = "?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab";
//var qs = "?=&=";
//var qs = ""

var results = querystring(qs);

(document.getElementById("results")).innerHTML =JSON.stringify(results, null, 2);

<script 
src="https://rawgit.com/EldonMcGuinness/querystring.js/master/dist/querystring.min.js"></script>
<pre id="results">RESULTS: Waiting...</pre>

Mật mã

Bài Gist của Eldon McGuinness cho đến nay là cách triển khai hoàn chỉnh nhất của trình phân tích chuỗi truy vấn JavaScript mà tôi đã thấy cho đến nay.

Thật không may, nó được viết dưới dạng một plugin jQuery.

Tôi đã viết lại nó thành vanilla JS và thực hiện một số cải tiến:

function parseQuery(str) {
  var qso = {};
  var qs = (str || document.location.search);
  // Check for an empty querystring
  if (qs == "") {
    return qso;
  }
  // Normalize the querystring
  qs = qs.replace(/(^\?)/, '').replace(/;/g, '&');
  while (qs.indexOf("&&") != -1) {
    qs = qs.replace(/&&/g, '&');
  }
  qs = qs.replace(/([\&]+$)/, '');
  // Break the querystring into parts
  qs = qs.split("&");
  // Build the querystring object
  for (var i = 0; i < qs.length; i++) {
    var qi = qs[i].split("=");
    qi = qi.map(function(n) {
      return decodeURIComponent(n)
    });
    if (typeof qi[1] === "undefined") {
      qi[1] = null;
    }
    if (typeof qso[qi[0]] !== "undefined") {

      // If a key already exists then make this an object
      if (typeof (qso[qi[0]]) == "string") {
        var temp = qso[qi[0]];
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]] = [];
        qso[qi[0]].push(temp);
        qso[qi[0]].push(qi[1]);

      } else if (typeof (qso[qi[0]]) == "object") {
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]].push(qi[1]);
      }
    } else {
      // If no key exists just set it as a string
      if (qi[1] == "") {
        qi[1] = null;
      }
      qso[qi[0]] = qi[1];
    }
  }
  return qso;
}

Làm thế nào để sử dụng nó

var results = parseQuery("?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab");

Đầu ra

{
  "foo": ["bar", "boo" ],
  "roo": "bar",
  "bee": "bop",
  "": ["ghost", "ghost2"],
  "checkbox[]": ["b1", "b2"],
  "dd": null,
  "http": [
    "http://w3schools.com/my test.asp?name=ståle&car=saab",
    "http://w3schools2.com/my test.asp?name=ståle&car=saab"
  ]
}

Xem thêm Fiddle này .

function decode(s) {
    try {
        return decodeURIComponent(s).replace(/\r\n|\r|\n/g, "\r\n");
    } catch (e) {
        return "";
    }
}
function getQueryString(win) {
    var qs = win.location.search;
    var multimap = {};
    if (qs.length > 1) {
        qs = qs.substr(1);
        qs.replace(/([^=&]+)=([^&]*)/g, function(match, hfname, hfvalue) {
            var name = decode(hfname);
            var value = decode(hfvalue);
            if (name.length > 0) {
                if (!multimap.hasOwnProperty(name)) {
                    multimap[name] = [];
                }
                multimap[name].push(value);
            }
        });
    }
    return multimap;
}
var keys = getQueryString(window);
for (var i in keys) {
    if (keys.hasOwnProperty(i)) {
        for (var z = 0; z < keys[i].length; ++z) {
            alert(i + ":" + keys[i][z]);
        }
    }
}

Tôi muốn giữ cho nó đơn giản, dễ đọc và nhỏ.

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);

Thí dụ:

searchToObject('?query=myvalue')['query']; // spits out: 'myvalue'

Hàm tôi đã viết cho một yêu cầu tương tự như thế này với thao tác chuỗi javascript thuần túy

"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;
}

Sử dụng:

queryize(window.location.href)['Name'] //returns John
queryize(window.location.href)['Age'] //returns 20
queryize(window.location.href)['Gender'] //returns Male

Nếu bạn đang sử dụng lodash + ES6, đây là một giải pháp đơn giản: _.object(window.location.search.replace(/(^\?)/, '').split('&').map(keyVal => keyVal.split('=')));

Được rồi, vì mọi người đang bỏ qua câu hỏi thực sự của tôi, heh, tôi cũng sẽ đăng bài của tôi! Đây là những gì tôi có:

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;
})();

Và các bài kiểm tra:

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

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

Bạn nghĩ rằng, JavaScript không phải là tiếng mẹ đẻ của tôi.

Dù sao, tôi đang tìm kiếm một thư viện JavaScript (ví dụ: jQuery, Prototype) đã có một thư viện được viết. :)

Dựa trên câu trả lời của @CMS Tôi có những điều sau (trong CoffeeScript có thể dễ dàng chuyển đổi sang 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

Bạn có thể dễ dàng lấy những thứ mình cần với:

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

Chiến thắng ở đây là giao diện hướng đối tượng (thay vì chức năng) và nó có thể được thực hiện trên bất kỳ chuỗi nào (không chỉ location.search).

Nếu bạn đang sử dụng thư viện JavaScript, chức năng này đã tồn tại. Ví dụ ở đây là phiên bản của Prototype