关于解析:在JavaScript中解析查询字符串

Parse query string in JavaScript

本问题已经有最佳答案,请猛点这里访问。

Possible Duplicate:
How can I get query string values?

我需要解析查询字符串www.mysite.com/default.aspx?dest=aboutus.aspx。如何获取javascript中的dest变量?


以下是一种快速简便的分析javascript中查询字符串的方法:

1
2
3
4
5
6
7
8
9
10
11
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 (decodeURIComponent(pair[0]) == variable) {
            return decodeURIComponent(pair[1]);
        }
    }
    console.log('Query variable %s not found', variable);
}

现在请求page.html?您好:

1
console.log(getQueryVariable('x'));


1
2
3
4
5
6
7
8
9
function parseQuery(queryString) {
    var query = {};
    var pairs = (queryString[0] === '?' ? queryString.substr(1) : queryString).split('&');
    for (var i = 0; i < pairs.length; i++) {
        var pair = pairs[i].split('=');
        query[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1] || '');
    }
    return query;
}

将像hello=1&another=2这样的查询字符串转换为对象{hello: 1, another: 2}。从那里,很容易提取所需的变量。

也就是说,它不处理数组情况,如"hello=1&hello=2&hello=3"。要处理此问题,必须在添加对象之前检查所创建对象的属性是否存在,并将其值转换为数组,从而推送任何其他位。


您还可以使用rodney rehm提供的出色的uri.js库。以下是如何:

1
2
var qs = URI('www.mysite.com/default.aspx?dest=aboutus.aspx').query(true); // == { dest : 'aboutus.aspx' }
    alert(qs.dest); // == aboutus.aspx

并解析当前页的查询字符串:

1
2
var $_GET = URI(document.URL).query(true); // ala PHP
    alert($_GET['dest']); // == aboutus.aspx


我也是!http://jsfiddle.net/drzaus/8ee8kk/

(注:无花式嵌套或重复检查)

1
2
3
4
5
6
7
8
9
10
11
12
deparam = function (querystring) {
  // remove any preceding url and split
  querystring = querystring.substring(querystring.indexOf('?')+1).split('&');
  var params = {}, pair, d = decodeURIComponent;
  // march and parse
  for (var i = querystring.length - 1; i >= 0; i--) {
    pair = querystring[i].split('=');
    params[d(pair[0])] = d(pair[1] || '');
  }

  return params;
};//--  fn  deparam

测试:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var tests = {};
tests["simple params"] ="ID=2&first=1&second=b";
tests["full url"] ="http://blah.com/?" + tests["simple params"];
tests['just ?'] = '?' + tests['simple params'];

var $output = document.getElementById('output');
function output(msg) {
  $output.innerHTML +="
"
+ Array.prototype.slice.call(arguments, 0).join("
"
);
}
$.each(tests, function(msg, test) {
  var q = deparam(test);
  // prompt, querystring, result, reverse
  output(msg, test, JSON.stringify(q), $.param(q));
  output('-------------------');
});

结果:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
simple params
ID=2&first=1&second=b
{"second":"b","first":"1","ID":"2"}
second=b&first=1&ID=2
-------------------
full url
http://blah.com/?ID=2&first=1&second=b
{"second":"b","first":"1","ID":"2"}
second=b&first=1&ID=2
-------------------
just ?
?ID=2&first=1&second=b
{"second":"b","first":"1","ID":"2"}
second=b&first=1&ID=2
-------------------


这里是我的版本松散地在上面的SpuryAd版本,但解析成"字典"和支持搜索ARGS没有"="。在我的jQuery $(文档).Read()函数中使用它。参数被存储为AgSpScript中的键值对,您可能需要保存某处…

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
'use strict';

function parseQuery(search) {

    var args = search.substring(1).split('&');

    var argsParsed = {};

    var i, arg, kvp, key, value;

    for (i=0; i < args.length; i++) {

        arg = args[i];

        if (-1 === arg.indexOf('=')) {

            argsParsed[decodeURIComponent(arg).trim()] = true;
        }
        else {

            kvp = arg.split('=');

            key = decodeURIComponent(kvp[0]).trim();

            value = decodeURIComponent(kvp[1]).trim();

            argsParsed[key] = value;
        }
    }

    return argsParsed;
}

parseQuery(document.location.search);


从我的评论到博比发布的答案,下面是我将使用的代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
    function parseQuery(str)
        {
        if(typeof str !="string" || str.length == 0) return {};
        var s = str.split("&");
        var s_length = s.length;
        var bit, query = {}, first, second;
        for(var i = 0; i < s_length; i++)
            {
            bit = s[i].split("=");
            first = decodeURIComponent(bit[0]);
            if(first.length == 0) continue;
            second = decodeURIComponent(bit[1]);
            if(typeof query[first] =="undefined") query[first] = second;
            else if(query[first] instanceof Array) query[first].push(second);
            else query[first] = [query[first], second];
            }
        return query;
        }

此代码接受提供的querystring(作为"str"),并返回一个对象。字符串在所有发生的&;事件上被拆分,形成一个数组。然后对数组进行遍历,其中的每个项被"="拆分。这会产生子数组,其中第0个元素是参数,第1个元素是值(如果没有=符号,则为未定义)。这些属性映射到对象属性,因此例如字符串"hello=1&another=2&something"将转换为:

1
2
3
4
5
{
hello:"1",
another:"2",
something: undefined
}

此外,此代码注意到重复出现,例如"hello=1&hello=2",并将结果转换为数组,例如:

1
2
3
{
hello: ["1","2"]
}

您还将注意到它处理的是不使用=符号的情况。它还忽略符号后是否有等号。

对于最初的问题有点过分了,但是如果您需要在javascript中使用querystrings,这是一个可重用的解决方案:)


如果您知道只有一个querystring变量,那么只需执行以下操作:

1
var dest = location.search.replace(/^.*?\=/, '');


下面的函数将用正则表达式解析搜索字符串,缓存结果并返回所请求变量的值:

1
2
3
4
5
6
7
8
9
10
11
12
13
window.getSearch = function(variable) {
  var parsedSearch;
  parsedSearch = window.parsedSearch || (function() {
    var match, re, ret;
    re = /\??(.*?)=([^\&]*)&?/gi;
    ret = {};
    while (match = re.exec(document.location.search)) {
      ret[match[1]] = match[2];
    }
    return window.parsedSearch = ret;
  })();
  return parsedSearch[variable];
};

您可以在没有任何参数的情况下调用它一次,并与EDCOX1 OR 2对象一起工作,或随后调用EDCOX1 OR 3。我还没有完全测试过,正则表达式可能还需要一些调整…


我想要一个简单的函数,它以一个URL作为输入,并返回一个查询参数的映射。如果我要改进这个函数,我将支持URL中数组数据和或嵌套变量的标准。

这应该与jquery.param(qparams)函数一起工作。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function getQueryParams(url){
    var qparams = {},
        parts = (url||'').split('?'),
        qparts, qpart,
        i=0;

    if(parts.length <= 1 ){
        return qparams;
    }else{
        qparts = parts[1].split('&');
        for(i in qparts){

            qpart = qparts[i].split('=');
            qparams[decodeURIComponent(qpart[0])] =
                           decodeURIComponent(qpart[1] || '');
        }
    }

    return qparams;
};


我想在页面的dom元素中获取特定链接,在计时器上将这些用户发送到重定向页面,然后将其传递到原始单击的URL。这就是我如何使用包含上述方法之一的常规JavaScript来完成的。

带链接的页面:标题

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
  function replaceLinks() {  
var content = document.getElementById('mainContent');
            var nodes = content.getElementsByTagName('a');
        for (var i = 0; i < document.getElementsByTagName('a').length; i++) {
            {
                href = nodes[i].href;
                if (href.indexOf("thisurl.com") != -1) {

                    nodes[i].href="http://www.thisurl.com/redirect.aspx" +"?url=" + nodes[i];
                    nodes[i].target="_blank";

                }
            }
    }
}

身体

1
<body onloadx="replaceLinks()">

重定向页面头

1
2
3
4
5
6
7
8
9
10
11
12
13
14
   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 (decodeURIComponent(pair[0]) == variable) {
                return decodeURIComponent(pair[1]);
            }
        }
        console.log('Query variable %s not found', variable);
    }
    function delayer(){
        window.location = getQueryVariable('url')
    }

身体

1
<body onloadx="setTimeout('delayer()', 1000)">


这个怎么样?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function getQueryVar(varName){
    // Grab and unescape the query string - appending an '&' keeps the RegExp simple
    // for the sake of this example.
    var queryStr = unescape(window.location.search) + '&';

    // Dynamic replacement RegExp
    var regex = new RegExp('.*?[&\\?]' + varName + '=(.*?)&.*');

    // Apply RegExp to the query string
    val = queryStr.replace(regex,"$1");

    // If the string is the same, we didn't find a match - return false
    return val == queryStr ? false : val;
}

…那就用以下方式来称呼它:

1
alert('Var"dest" = ' + getQueryVar('dest'));

干杯


看看这个解决方案。使用这个函数,您不需要调用gup('dest')来获取url dest参数。