首页 文章

在JavaScript中解析查询字符串[重复]

提问于
浏览
299

可能重复:如何获取查询字符串值?

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

12 回答

  • 21

    这是一种在JavaScript中解析查询字符串的快速简便方法:

    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?x=Hello

    console.log(getQueryVariable('x'));
    
  • 5
    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" 等数组情况 . 要使用它,您必须在添加之前检查您所创建的对象的属性是否存在,并将其值转换为数组,并推送任何其他位 .

  • 13

    您也可以使用Rodney Rehm的优秀URI.js库 . 这是如何做:-

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

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

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

    这是我的版本松散地基于Braceyard的版本,但解析为'字典'并支持没有'='的搜索参数 . 在我的JQuery $(document).ready()函数中使用它 . 参数存储为argsParsed中的键/值对,您可能希望将其存储在某处...

    '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);
    
  • 21

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

    (注意:没有花哨的嵌套或重复检查)

    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
    

    并测试:

    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 += "\n" + Array.prototype.slice.call(arguments, 0).join("\n");
    }
    $.each(tests, function(msg, test) {
      var q = deparam(test);
      // prompt, querystring, result, reverse
      output(msg, test, JSON.stringify(q), $.param(q));
      output('-------------------');
    });
    

    结果是:

    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
    -------------------
    
  • 2

    继我对@bobby发布的答案的评论后,这里是我将使用的代码:

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

    此代码接受提供的查询字符串(作为'str')并返回一个对象 . 字符串在&的所有出现时被拆分,从而产生一个数组 . 然后对该数组进行travsers,并将其中的每个项目拆分为“=” . 这导致子数组,其中第0个元素是参数,第1个元素是值(如果没有=符号,则为undefined) . 这些映射到对象属性,因此例如字符串“hello = 1&another = 2&something”变为:

    {
    hello: "1",
    another: "2",
    something: undefined
    }
    

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

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

    你还会注意到它处理了没有使用=符号的情况 . 如果在&符号后面有一个等号,它也会忽略 .

    对于原始问题有点矫枉过正,但如果您需要在javascript中使用查询字符串,则可以使用可重用的解决方案:)

  • 293

    如果您知道只有一个查询字符串变量,则可以执行以下操作:

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

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

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

    您可以在没有任何参数的情况下调用一次并使用 window.parsedSearch 对象,或者随后调用 getSearch . 我还没有完全测试过这个,正则表达式可能还需要一些调整......

  • 55

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

    这应该可以使用jQuery.param(qparams)函数 .

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

    这个怎么样?

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

    ..然后只需用:

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

    干杯

  • 127

    我想在页面上的DOM元素中选取特定链接,将这些用户发送到计时器上的重定向页面,然后将它们传递到原始单击的URL . 这就是我使用常规javascript结合上述方法之一的方法 .

    Page with links:

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

    Body

    <body onload="replaceLinks()">
    

    Redirect page

    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')
        }
    

    身体

    <body onload="setTimeout('delayer()', 1000)">
    
  • 7

    看看this solution . 使用他的函数,你只需要调用 gup('dest') 来获取URL dest 参数 .

相关问题