关于javascript：如何从GET参数中获取值？


How to get the value from the GET parameters?

我有一个带有一些get参数的URL，如下所示：

1
www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5

我需要得到EDOCX1的全部价值。我试着读网址，但只得到了m2。我该如何使用javascript？

javascript本身没有用于处理查询字符串参数的内置功能。

在(现代)浏览器中运行的代码可以使用URL对象(它是浏览器向JS提供的API的一部分)：

1
2
3
4
var url_string ="http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5"; //window.location.href
var url = new URL(url_string);
var c = url.searchParams.get("c");
console.log(c);

对于较旧的浏览器(包括Internet Explorer)，您可以使用此polyfill或此答案的原始版本中早于URL的代码：

您可以访问location.search，它将从?字符到URL的结尾或片段标识符(foo)的开头，以先到者为准。

然后你可以用这个来解析它：

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
function parse_query_string(query) {
  var vars = query.split("&");
  var query_string = {};
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    var key = decodeURIComponent(pair[0]);
    var value = decodeURIComponent(pair[1]);
    // If first entry with this name
    if (typeof query_string[key] ==="undefined") {
      query_string[key] = decodeURIComponent(value);
      // If second entry with this name
    } else if (typeof query_string[key] ==="string") {
      var arr = [query_string[key], decodeURIComponent(value)];
      query_string[key] = arr;
      // If third or later entry with this name
    } else {
      query_string[key].push(decodeURIComponent(value));
    }
  }
  return query_string;
}

var query_string ="a=1&b=3&c=m2-m3-m4-m5";
var parsed_qs = parse_query_string(query_string);
console.log(parsed_qs.c);

您可以从当前页面的URL获取查询字符串：

1
2
var query = window.location.search.substring(1);
var qs = parse_query_string(query);
相关讨论

我看到过的大多数实现都忽略了URL对名称和值的解码。

下面是一个通用的实用程序函数，它还可以进行正确的URL解码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function getQueryParams(qs) {
    qs = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);
相关讨论

来源

1
2
3
4
5
6
7
8
9
function gup( name, url ) {
    if (!url) url = location.href;
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS ="[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( url );
    return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')
相关讨论

这是只检查一个参数的简单方法：

示例URL：

1
    http://myserver/action?myParam=2

示例javascript：

1
    var myParam = location.search.split('myParam=')[1]

如果URL中存在"myparam"…变量myparam将包含"2"，否则将未定义。

也许您需要一个默认值，在这种情况下：

1
    var myParam = location.search.split('myParam=')[1] ? location.search.split('myParam=')[1] : 'myDefaultValue';

更新：这更有效：

1
2
3
    var url ="http://www.example.com/index.php?myParam=384&login=admin"; // or window.location.href for current url
    var captured = /myParam=([^&]+)/.exec(url)[1]; // Value is in [1] ('384' in our case)
    var result = captured ? captured : 'myDefaultValue';

即使URL中充满了参数，它也能正常工作。

相关讨论

浏览器供应商已经实现了一种通过URL和urlSearchParams实现这一点的本地方法。

1
2
3
let url = new URL('http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5');
let searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('c'));  // outputs"m2-m3-m4-m5"

目前在firefox、opera、safari、chrome和edge中受支持。有关浏览器支持的列表，请参阅此处。

https://developer.mozilla.org/en-us/docs/web/api/urlsearchparamshttps://developer.mozilla.org/en-us/docs/web/api/url/url

https://url.spec.whatwg.org网站/

谷歌工程师EricBidelman建议在不支持的浏览器中使用这种polyfill。

相关讨论

我早就发现了，很容易：

1
2
3
4
5
6
7
8
function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,    
    function(m,key,value) {
      vars[key] = value;
    });
    return vars;
  }

然后这样称呼它：

1
var fType = getUrlVars()["type"];
相关讨论

您可以在location.search中得到查询字符串，然后在问号后面拆分所有内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var params = {};

if (location.search) {
    var parts = location.search.substring(1).split('&');

    for (var i = 0; i < parts.length; i++) {
        var nv = parts[i].split('=');
        if (!nv[0]) continue;
        params[nv[0]] = nv[1] || true;
    }
}

// Now you can get the parameters you want like so:
var abc = params.abc;
相关讨论

我写了一个更简单和优雅的解决方案。

1
2
var arr = document.URL.match(/room=([0-9]+)/)
var room = arr[1];
相关讨论

这里有一个递归的解决方案，它没有regex，并且有最小的突变(只有params对象是突变的，我认为这在JS中是不可避免的)。

太棒了，因为它：

  • 是递归的
  • 处理多个同名参数
  • 处理格式错误的参数字符串(缺少值等)
  • 如果值中有"="，则不中断
  • 执行URL解码
  • 最后一点，太棒了，因为…啊！！！！

代码：

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
var get_params = function(search_string) {

  var parse = function(params, pairs) {
    var pair = pairs[0];
    var parts = pair.split('=');
    var key = decodeURIComponent(parts[0]);
    var value = decodeURIComponent(parts.slice(1).join('='));

    // Handle multiple parameters of the same name
    if (typeof params[key] ==="undefined") {
      params[key] = value;
    } else {
      params[key] = [].concat(params[key], value);
    }

    return pairs.length == 1 ? params : parse(params, pairs.slice(1))
  }

  // Get rid of leading ?
  return search_string.length == 0 ? {} : parse({}, search_string.substr(1).split('&'));
}

var params = get_params(location.search);

// Finally, to get the param you want
params['c'];
相关讨论

看到这个

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
function getURLParameters(paramName)
{
    var sURL = window.document.URL.toString();
    if (sURL.indexOf("?") > 0)
    {
        var arrParams = sURL.split("?");
        var arrURLParams = arrParams[1].split("&");
        var arrParamNames = new Array(arrURLParams.length);
        var arrParamValues = new Array(arrURLParams.length);

        var i = 0;
        for (i = 0; i<arrURLParams.length; i++)
        {
            var sParam =  arrURLParams[i].split("=");
            arrParamNames[i] = sParam[0];
            if (sParam[1] !="")
                arrParamValues[i] = unescape(sParam[1]);
            else
                arrParamValues[i] ="No Value";
        }

        for (i=0; i<arrURLParams.length; i++)
        {
            if (arrParamNames[i] == paramName)
            {
                //alert("Parameter:" + arrParamValues[i]);
                return arrParamValues[i];
            }
        }
        return"No Parameters Found";
    }
}
相关讨论

使用URLSearchParams的超简单方法。

1
2
3
function getParam(param){
  return new URLSearchParams(window.location.search).get(param);
}

它目前在Chrome、Firefox、Safari、Edge等软件中得到了支持。

相关讨论

我做了一个这样的函数：

1
2
3
4
5
6
7
8
9
10
var getUrlParams = function (url) {
  var params = {};
  (url + '?').split('?')[1].split('&').forEach(function (pair) {
    pair = (pair + '=').split('=').map(decodeURIComponent);
    if (pair[0].length) {
      params[pair[0]] = pair[1];
    }
  });
  return params;
};

更新5/26/2017，这里是ES7实现(使用Babel预设阶段0、1、2或3运行)：

1
2
3
4
const getUrlParams = url => `${url}?`.split('?')[1]
  .split('&').reduce((params, pair) =>
    ((key, val) => key ? {...params, [key]: val} : params)
    (...`${pair}=`.split('=').map(decodeURIComponent)), {});

一些测试：

1
2
3
4
5
console.log(getUrlParams('https://google.com/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('https://google.com/')); // Will log {}
console.log(getUrlParams('a=1&b=2&c')); // Will log {}

更新3/26/2018，这里是一个类型脚本实现：

1
2
3
4
5
6
7
8
9
10
11
12
13
const getUrlParams = (search: string) => `${search}?`
  .split('?')[1]
  .split('&')
  .reduce(
    (params: object, pair: string) => {
      const [key, value] = `${pair}=`
        .split('=')
        .map(decodeURIComponent)

      return key.length > 0 ? { ...params, [key]: value } : params
    },
    {}
  )

更新2/13/2019，这里是一个与typescript 3一起工作的更新的typescript实现。

1
2
3
4
5
6
7
8
9
10
interface IParams { [key: string]: string }

const paramReducer = (params: IParams, pair: string): IParams => {
  const [key, value] = `${pair}=`.split('=').map(decodeURIComponent)

  return key.length > 0 ? { ...params, [key]: value } : params
}

const getUrlParams = (search: string): IParams =>
  `${search}?`.split('?')[1].split('&').reduce<IParams>(paramReducer, {})
相关讨论

ECMAScript 6解决方案：

1
2
3
4
5
var params = window.location.search
  .substring(1)
  .split("&")
  .map(v => v.split("="))
  .reduce((map, [key, value]) => map.set(key, decodeURIComponent(value)), new Map())
相关讨论

我使用parseuri库。它可以让你完全按照自己的要求去做：

1
2
3
var uri = 'www.test.com/t.html&a=1&b=3&c=m2-m3-m4-m5';
var c = uri.queryKey['c'];
// c = 'm2-m3-m4-m5'

我用

1
2
3
4
function getVal(str) {
    var v = window.location.search.match(new RegExp('(?:[\?\&]'+str+'=)([^&]+)'));
    return v ? v[1] : null;
}
相关讨论

这是我的解决方案。正如安迪E在回答这个问题时所建议的那样，如果反复构建各种regex字符串、运行循环等只是为了得到一个值，那么对脚本的性能就没有好处。所以，我想出了一个简单的脚本，返回单个对象中的所有get参数。您应该只调用一次，将结果赋给一个变量，然后在将来的任何时候，使用适当的键从该变量中获取您想要的任何值。请注意，它还负责URI解码(如%20)，并将+替换为空格：

1
2
3
4
5
6
7
8
9
10
11
 function getUrlQueryParams(url) {
  var queryString = url.split("?")[1];
  var keyValuePairs = queryString.split("&");
  var keyValue = [];
  var queryParams = {};
  keyValuePairs.forEach(function(pair) {
    keyValue = pair.split("=");
    queryParams[keyValue[0]] = decodeURIComponent(keyValue[1]).replace(/\+/g,"");
});
  return queryParams;
}

下面是对脚本的一些测试，供您查看：

1
2
3
4
5
6
7
8
9
10
11
12
// Query parameters with strings only, no special characters.
var currentParams = getUrlQueryParams("example.com/foo?number=zero");
alert(currentParams["number"]); // Gives"zero".

// For the URL you stated above...
var someParams = getUrlQueryParams("www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5");
alert(someParams["c"]); // Gives"m2-m3-m4-m5".

// For a query params with URI encoding...
var someParams = getUrlQueryParams("www.example.com/t.html?phrase=a%20long%20shot&location=Silicon+Valley%2C+USA");
alert(someParams["phrase"]); // Gives"a long shot".
alert(someParams["location"]); // Gives"Silicon Valley, USA".
相关讨论

对于像index.html这样的单个参数值？msg=1使用以下代码，

1
2
3
4
5
6
7
8
9
10
11
12
13
$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search.substring(1);
    var varArray = queryString.split("="); //eg. index.html?msg=1

    var param1 = varArray[0];
    var param2 = varArray[1];

}

对于所有参数值，使用以下代码，

1
2
3
4
5
6
7
8
9
10
11
12
13
$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search;
    var varArray = queryString.split("&");
    for (var i=0;i<varArray.length;i++) {
      var param = varArray[i].split("=");
        //parameter-value pair
    }
}
相关讨论

这里我发布了一个例子。但它在jquery中。希望它能帮助别人：

1
2
3
4
5
6
7
8
9
10
11
12
13
<script type="text/javascript" src="jquery.js">
<script type="text/javascript" src="jquery.url.js">

<!-- URL:  www.example.com/correct/?message=done&year=1990-->

<script type="text/javascript">
$(function(){
    $.url.attr('protocol')  // --> Protocol:"http"
    $.url.attr('path')          // --> host:"www.example.com"
    $.url.attr('query')         // --> path:"/correct/"
    $.url.attr('message')   // --> query:"done"
    $.url.attr('year')      // --> query:"1990"
});
相关讨论

这个问题的答案太多，所以我要添加另一个。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
/**
 * parses and returns URI query parameters
 *
 * @param {string} param parm
 * @param {bool?} asArray if true, returns an array instead of a scalar
 * @returns {Object|Array}
 */
function getURIParameter(param, asArray) {
    return document.location.search.substring(1).split('&').reduce(function(p,c) {
        var parts = c.split('=', 2).map(function(param) { return decodeURIComponent(param); });
        if(parts.length == 0 || parts[0] != param) return (p instanceof Array) && !asArray ? null : p;
        return asArray ? p.concat(parts.concat(true)[1]) : parts.concat(true)[1];
    }, []);
}

用途：

1
2
getURIParameter("id")  // returns the last id or null if not present
getURIParameter("id", true) // returns an array of all ids

这可以处理空参数(那些不带"=value"的键)、暴露标量和基于数组的值检索API以及正确的URI组件解码。

或者，如果您不想重新创建URI解析轮子，请使用uri.js

要获取名为foo的参数的值，请执行以下操作：

1
new URI((''+document.location)).search(true).foo

它的作用是

  • 将document.location转换为字符串(它是一个对象)
  • 将该字符串馈送到uri.js的uri类construtor
  • 调用search()函数以获取URL的搜索(查询)部分(传递true会告诉它输出一个对象)
  • 访问结果对象的foo属性以获取值

    • 这是一把小提琴……http://jsfiddle.net/m6tett01/12/

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    // Read a page's GET URL variables and return them as an associative array.
    function getUrlVars()
    {
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
            hash = hashes[i].split('=');
            vars.push(hash[0]);
            vars[hash[0]] = hash[1];
        }
        return vars;
    }

    // Usage for URL: http://my.site.com/location?locationId=53cc272c0364aefcb78756cd&shared=false
    var id = getUrlVars()["locationId"];

    从这里获取：http://jquery-howto.blogspot.ru/2009/09/get-url-parameters-values-with-jquery.html

    相关讨论

    简单方法

    1
    2
    3
    4
    5
    6
    7
    8
    9
    function getParams(url){
            var regex = /[?&]([^=#]+)=([^&#]*)/g,
                params = {},
                match;
            while(match = regex.exec(url)) {
                params[match[1]] = match[2];
            }
            return params;
        }

    然后像getparams(url)一样调用它

    最短路线：

    1
    new URL(location.href).searchParams.get("my_key");
    相关讨论

    还有一个建议。

    已经有了一些很好的答案，但我发现它们不必要地复杂和难以理解。这是一个简短、简单的数组，返回一个简单的关联数组，其中键名与URL中的标记名相对应。

    我在下面为那些想学习的人添加了一个带有评论的版本。

    注意，它的循环依赖于jquery($.each)，我建议不要使用for each。我发现使用jquery来确保跨浏览器的兼容性比插入单独的补丁来支持旧浏览器不支持的新功能更简单。

    编辑：在我写下这篇文章之后，我注意到埃里克·埃利奥特的回答，虽然它使用了foreach，但几乎是相同的，而我通常反对(出于上述原因)。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    function getTokens(){
        var tokens = [];
        var query = location.search;
        query = query.slice(1);
        query = query.split('&');
        $.each(query, function(i,value){    
            var token = value.split('=');  
            var key = decodeURIComponent(token[0]);    
            var data = decodeURIComponent(token[1]);
            tokens[key] = data;
        });
        return tokens;
    }

    注释版本：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    function getTokens(){
        var tokens = [];            // new array to hold result
        var query = location.search; // everything from the '?' onward
        query = query.slice(1);     // remove the first character, which will be the '?'
        query = query.split('&');   // split via each '&', leaving us an array of something=something strings

        // iterate through each something=something string
        $.each(query, function(i,value){    

            // split the something=something string via '=', creating an array containing the token name and data
            var token = value.split('=');  

            // assign the first array element (the token name) to the 'key' variable
            var key = decodeURIComponent(token[0]);    

            // assign the second array element (the token data) to the 'data' variable
            var data = decodeURIComponent(token[1]);

            tokens[key] = data;     // add an associative key/data pair to our result array, with key names being the URI token names
        });

        return tokens;  // return the array
    }

    对于下面的示例，我们将假定此地址：

    1
    http://www.example.com/page.htm?id=4&name=murray

    您可以将URL标记分配给自己的变量：

    1
    var tokens = getTokens();

    然后按如下名称引用每个URL令牌：

    1
    document.write( tokens['id'] );

    这将打印"4"。

    您也可以直接从函数中引用一个令牌名称：

    1
    document.write( getTokens()['name'] );

    …上面印着"默里"。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    // http:localhost:8080/path?param_1=a&param_2=b
    var getParamsMap = function () {
        var params = window.location.search.split("&");
        var paramsMap = {};
        params.forEach(function (p) {
            var v = p.split("=");
            paramsMap[v[0]]=decodeURIComponent(v[1]);
        });
        return paramsMap;
    };

    // -----------------------

    console.log(getParamsMap()["param_1"]);  // should log"a"
    相关讨论

    我需要读取一个url get变量并根据url参数完成一个操作。我到处寻找解决方案，发现了这段代码。它基本上读取当前页面的URL，对URL执行一些正则表达式，然后将URL参数保存在一个关联数组中，我们可以很容易地访问它。

    所以作为一个例子，如果我们有下面的URL，并且javascript位于底部。

    1
    http://TestServer/Pages/NewsArchive.aspx?year=2013&Month=July

    获取参数id和page所需要做的就是调用：

    代码为：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    <script type="text/javascript">
    var first = getUrlVars()["year"];
    var second = getUrlVars()["Month"];

    alert(first);
    alert(second);
    function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
    vars[key] = value;
    });
    return vars;
    }

    以下是用于将URL查询参数解析为对象的AngularJS源代码：

    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
    35
    function tryDecodeURIComponent(value) {
      try {
        return decodeURIComponent(value);
      } catch (e) {
        // Ignore any invalid uri component
      }
    }

    function isDefined(value) {return typeof value !== 'undefined';}

    function parseKeyValue(keyValue) {
      keyValue = keyValue.replace(/^\?/, '');
      var obj = {}, key_value, key;
      var iter = (keyValue ||"").split('&');
      for (var i=0; i<iter.length; i++) {
        var kValue = iter[i];
        if (kValue) {
          key_value = kValue.replace(/\+/g,'%20').split('=');
          key = tryDecodeURIComponent(key_value[0]);
          if (isDefined(key)) {
            var val = isDefined(key_value[1]) ? tryDecodeURIComponent(key_value[1]) : true;
            if (!hasOwnProperty.call(obj, key)) {
              obj[key] = val;
            } else if (isArray(obj[key])) {
              obj[key].push(val);
            } else {
              obj[key] = [obj[key],val];
            }
          }
        }
      };
      return obj;
    }

    alert(JSON.stringify(parseKeyValue('?a=1&b=3&c=m2-m3-m4-m5')));

    您可以将此函数添加到window.location中：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    window.location.query = function query(arg){
      q = parseKeyValue(this.search);
      if (!isDefined(arg)) {
        return q;
      }      
      if (q.hasOwnProperty(arg)) {
        return q[arg];
      } else {
        return"";
      }
    }

    // assuming you have this url :
    // http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5

    console.log(window.location.query())

    // Object {a:"1", b:"3", c:"m2-m3-m4-m5"}

    console.log(window.location.query('c'))

    //"m2-m3-m4-m5"

    EldonMcGuiness的这一要点是迄今为止我所见过的最完整的JavaScript查询字符串解析器实现。

    不幸的是，它是作为jquery插件编写的。

    我把它改写为Vanilla JS并做了一些改进：

    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
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    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;
    }

    // DEMO
    console.log(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"));

    另见这把小提琴。

    相关讨论

    我要做的是：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    var uriParams = getSearchParameters();
    alert(uriParams.c);


    // background functions:

    // Get object/associative array of URL parameters
    function getSearchParameters () {
      var prmstr = window.location.search.substr(1);
      return prmstr !== null && prmstr !=="" ? transformToAssocArray(prmstr) : {};
    }

    // convert parameters from url-style string to associative array
    function transformToAssocArray (prmstr) {
      var params = {},
          prmarr = prmstr.split("&");

      for (var i = 0; i < prmarr.length; i++) {
        var tmparr = prmarr[i].split("=");
        params[tmparr[0]] = tmparr[1];
      }
      return params;
    }
    1
    window.location.href.split("?")

    然后忽略第一个索引

    1
    Array.prototype.slice.call(window.location.href.split("?"), 1)

    返回URL参数数组

    1
    2
    var paramArray = Array.prototype.slice.call(window.location.href.split(/[?=]+/), 1);
    var paramObject = paramArray.reduce(function(x, y, i, a){ (i%2==0) ?  (x[y] = a[i+1]) : void 0; return x; }, {});

    更详细/更具攻击性，但也更具功能性，paramobject包含所有映射为JS对象的参数。

    我们可以在不循环所有参数的情况下以更简单的方式获取C参数值，请参见下面的jquery以获取参数。

    1。要获取参数值：

    1
    2
    3
    var url ="www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";

    url.match(**/(c=)[0-9A-Za-z-]+/ig**)[0].replace('c=',"")

    (或)

    1
    url.match(**/(c=)[0-z-]+/ig**)[0].replace('c=',"")

    以字符串形式返回

    "m2-m3-m4-m5"

    2。要替换参数值：

    1
    2
    3
    var url ="www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";

    url.replace(**/(c=)[0-9A-Za-z-]+/ig,"c=m2345"**)
    相关讨论

    1
    2
    3
    4
    5
    6
    7
    8
    function getParamValue(param) {
        var urlParamString = location.search.split(param +"=");
        if (urlParamString.length <= 1) return"";
        else {
            var tmp = urlParamString[1].split("&");
            return tmp[0];
        }
    }

    不管参数是最后一个还是最后一个，这都适用于您的案例。

    php parse_str仿制..：)

    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
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    // Handles also array params well
    function parseQueryString(query) {
        var pars = (query != null ? query :"").replace(/&+/g,"&").split('&'),
            par, key, val, re = /^([\w]+)\[(.*)\]/i, ra, ks, ki, i = 0,
            params = {};

        while ((par = pars.shift()) && (par = par.split('=', 2))) {
            key = decodeURIComponent(par[0]);
            // prevent param value going to be"undefined" as string
            val = decodeURIComponent(par[1] ||"").replace(/\+/g,"");
            // check array params
            if (ra = re.exec(key)) {
                ks = ra[1];
                // init array param
                if (!(ks in params)) {
                    params[ks] = {};
                }
                // set int key
                ki = (ra[2] !="") ? ra[2] : i++;
                // set array param
                params[ks][ki] = val;
                // go on..
                continue;
            }
            // set param
            params[key] = val;
        }

        return params;
    }

    var query = 'foo=1&bar=The+bar!%20&arr[]=a0&arr[]=a1&arr[s]=as&isset&arr[]=last';
    var params = parseQueryString(query);
    console.log(params)
    console.log(params.foo)        // 1
    console.log(params.bar)        // The bar!
    console.log(params.arr[0])     // a0
    console.log(params.arr[1])     // a1
    console.log(params.arr.s)      // as
    console.log(params.arr.none)   // undefined
    console.log("isset" in params) // true like: isset($_GET['isset'])



    /*
    // in php
    parse_str('foo=1&bar=The+bar!%20&arr[]=a0&arr[]=a1&arr[s]=as&isset&arr[]=last', $query);
    print_r($query);

    Array
    (
        [foo] => 1
        [bar] => The bar!
        [arr] => Array
            (
                [0] => a0
                [1] => a1
                [s] => as
                [2] => last
            )

        [isset] =>
    )*/

    使用Dojo。这里没有其他的解决方案是这个短的或经过测试的：

    1
    2
    3
    4
    5
    6
    require(["dojo/io-query"], function(ioQuery){
        var uri ="www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";
        var query = uri.substring(uri.indexOf("?") + 1, uri.length);
        var queryObject = ioQuery.queryToObject(query);
        console.log(queryObject.c); //prints m2-m3-m4-m5
    });

    您可以添加一个输入框，然后要求用户将值复制到其中…这样做非常简单：

    1
    2
    3
    4
    5
    6
    Hey User! Can you please copy the value out of the location bar where it says like, &m=2? Thanks! And then, if you could...paste it in the box below and click the Done button?
    <input type='text' id='the-url-value' />
    <input type='button' value='This is the Done button. Click here after you do all that other stuff I wrote.' />


    //...read the value on click

    好吧，说真的……我发现了这段代码，它看起来很好用：

    Turning the Querystring into a JSON object using JavaScript

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    function queryToJSON() {
        var pairs = location.search.slice(1).split('&');

        var result = {};
        pairs.forEach(function(pair) {
            pair = pair.split('=');
            result[pair[0]] = decodeURIComponent(pair[1] || '');
        });

        return JSON.parse(JSON.stringify(result));
    }

    var query = queryToJSON();

    我喜欢尽可能地写速记：

    网址：example.com/mortgageu calc.htm？PMTS=120&intr=6.8&prin=10000

    普通JavaScript：

    1
    2
    3
    for ( var vObj = {}, i=0, vArr = window.location.search.substring(1).split('&');
            i < vArr.length; v = vArr[i++].split('='), vObj[v[0]] = v[1] ){}
    // vObj = {pmts:"120", intr:"6.8", prin:"10000"}

    从许多答案中学习(如Vamoose、Gnarf或Blixt)。

    您可以创建一个对象(或使用location对象)并添加一个方法，该方法允许您获取URL参数、解码和JS样式：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    Url = {
        params: undefined,
        get get(){
            if(!this.params){
                var vars = {};
                if(url.length!==0)
                    url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
                        key=decodeURIComponent(key);
                        if(typeof vars[key]==="undefined") {
                            vars[key]= decodeURIComponent(value);
                        }
                        else {
                            vars[key]= [].concat(vars[key], decodeURIComponent(value));
                        }
                    });
                this.params = vars;
            }
            return this.params;
        }
    };

    这允许只使用Url.get调用该方法。

    它第一次从URL获取对象时，下一次将加载保存的对象。

    例子

    在类似于?param1=param1Value¶m2=param2Value¶m1=param1Value2的URL中，可以获取如下参数：

    1
    2
    Url.get.param1 //["param1Value","param1Value2"]
    Url.get.param2 //"param2Value"

    将window.location中搜索对象的所有url参数提取为json

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    export const getURLParams = location => {
        const searchParams = new URLSearchParams(location.search)
        const params = {}

        for (let key of searchParams.keys()) {
            params[key] = searchParams.get(key)
        }

        return params
    }

    console.log(getURLParams({ search: '?query=someting&anotherquery=anotherthing' }))

    // --> {query:"someting", anotherquery:"anotherthing"}

    这里有一个解决方案，我发现它更易读一些，但它需要一个.forEach()垫片用于

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    var getParams = function () {
      var params = {};
      if (location.search) {
        var parts = location.search.slice(1).split('&');

        parts.forEach(function (part) {
          var pair = part.split('=');
          pair[0] = decodeURIComponent(pair[0]);
          pair[1] = decodeURIComponent(pair[1]);
          params[pair[0]] = (pair[1] !== 'undefined') ?
            pair[1] : true;
        });
      }
      return params;
    }

    我开发了一个Javascript工具，只需一个简单的步骤就可以做到这一点。

    首先，将此脚本链接复制到HTML的头部：

    1
    <script src="https://booligoosh.github.io/urlParams/urlParams.js">

    然后用urlParams.c或urlParams['c']得到c的值。简单！

    您可以在这里看到使用您的值的真实演示。

    还要记住，我确实开发了这个，但这是一个简单和无忧无虑的解决方案，您的问题。这个工具还包括十六进制字符解码，这通常是有帮助的。

    这是我的解决方案：jfiddle

    下面的方法返回一个字典，其中包含给定URL的参数。如果没有参数，则为空。

    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
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    function getParams(url){
        var paramsStart = url.indexOf('?');
        var params = null;

        //no params available
        if(paramsStart != -1){
            var paramsString = url.substring(url.indexOf('?') + 1, url.length);

            //only '?' available
            if(paramsString !=""){
                var paramsPairs = paramsString.split('&');

                //preparing
                params = {};
                var empty = true;
                var index  = 0;
                var key ="";
                var val ="";

                for(i = 0, len = paramsPairs.length; i < len; i++){
                    index = paramsPairs[i].indexOf('=');

                    //if assignment symbol found
                    if(index != -1){
                        key = paramsPairs[i].substring(0, index);
                        val = paramsPairs[i].substring(index + 1, paramsPairs[i].length);

                        if(key !="" && val !=""){

                            //extend here for decoding, integer parsing, whatever...

                            params[key] = val;

                            if(empty){
                                empty = false;
                            }
                        }                    
                    }
                }

                if(empty){
                    params = null;
                }
            }
        }

        return params;
    }

    你可以运行这个函数

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
        function getUrlVars()
        {
            var vars = [], hash;
            var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
            for(var i = 0; i < hashes.length; i++)
            {
                hash = hashes[i].split('=');
                vars.push(hash[0]);
                vars[hash[0]] = hash[1];
            }
            return vars;
        }

        var source = getUrlVars()["lm_supplier"];
        var el = source.toString();
        var result= decodeURI(el);

    console.log(result)

    此函数从URL获取所需内容，var source=geturlvars()["从url中得到什么"]；

    1
    2
    3
    4
    5
    6
    7
    8
        function gup() {
        var qs = document.location.search;
        qs = qs.split('+').join(' ');
        var params = {}, tokens, re = /[?&]?([^=]+)=([^&]*)/g;
        while (tokens = re.exec(qs))
            params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
        return params;
    }

    像它一样使用它

    1
    var params = gup()

    然后

    1
    2
    params.param1
    params.param2

    在我的示例中(重定向到具有所有子URL的新域)：：

    1
    window.location.replace("https://newdomain.com" + window.location.pathname);

    1
    2
    3
    4
    5
    $_GET: function (param) {
        var regex = new RegExp("(?:[?&]+" + param +"=)([^&]*)?","i");
        var match = regex.exec(window.location.href);
        return match === null ? match : match[1];
    }
    相关讨论

    这工作：

    1
    2
    3
    function getURLParameter(name) {
      return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [null, ''])[1].replace(/\+/g, '%20')) || null;
    }

    我没有得到任何其他工作的最佳答案。

    我更喜欢使用可用的资源，而不是重新设计如何解析这些参数。

  • 将URL解析为对象
  • 提取搜索参数部分
  • 使用数组扩展将searchParams从迭代器转换为数组。
  • 将键值数组缩小为一个对象。

    • 1
    2
    3
    4
    5
    const url = 'http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
    const params = [... new URL(url).searchParams.entries()]
      .reduce((a, c) => Object.assign(a, {[c[0]]:c[1]}), {})

    console.log(params);

    相关讨论

    如最新浏览器中的第一个答案所述，我们可以使用新的URL API，但是，一个更一致的本机javascript轻松解决方案可以获取对象中的所有参数并使用它们

    例如，这个类称为locationUtil。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    const locationSearch = () => window.location.search;
    const getParams = () => {
      const usefulSearch = locationSearch().replace('?', '');
      const params = {};
      usefulSearch.split('&').map(p => {
        const searchParam = p.split('=');
        const [key, value] = searchParam;
        params[key] = value;
        return params;
      });
      return params;
    };

    export const searchParams = getParams();

    用法：：现在可以导入类中的searchparams对象

    例如url---https://www.google.com?key1=https://www.linkedin.com/in/spiara/&valid=true。

    1
    2
    3
    4
    5
    6
    7
    import { searchParams } from '../somewhere/locationUtil';

    const {key1, valid} = searchParams;
    if(valid) {
     console.log("Do Something");
     window.location.href = key1;
    }

    您可以简单地使用核心javascript获取参数的键值作为JS对象：

    1
    2
    3
    4
    5
    6
    7
    var url_string ="http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5";
    var url = new URL(url_string);
    let obj = {};
    var c = url.searchParams.forEach((value, key) => {
      obj[key] = value;
    });
    console.log(obj);
    相关讨论

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    function parseUrl(url){
        let urlParam = url.split("?")[1];
        console.log("---------> URL param :" + urlParam);
        urlParam = urlParam.split("&");
        let urlParamObject = {};
        for(let i=0;i < urlParam.length;i++){
            let tmp = urlParam[i].split("=");
            urlParamObject[tmp[0]] = tmp[1];
        }
        return urlParamObject;
    }

    let param = parseUrl(url);
    param.a // output 10
    param.b // output 20

    我尝试了很多不同的方法，但当我在一个URL中查找参数值时，这个尝试过的真正regex函数对我有用，希望这有助于：

    1
    2
    3
    4
    5
    6
    7
    8
            var text = 'www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5'

            function QueryString(item, text){
                var foundString = text.match(new RegExp("[\?\&]" + item +"=([^\&]*)(\&?)","i"));
                return foundString ? foundString[1] : foundString;
            }

            console.log(QueryString('c', text));

    像QueuryString('param_name', url)一样使用，将返回值

    m2-m3-m4-m5

    我一次又一次地遇到同样的问题。现在这里有很多用户，我以我的hax工作而出名，

    所以我用以下方法来解决它：

    PHP:

    1
    2
    echo"<p style="display:none" id="hidden-GET">".$_GET['id']."
    </p>"    ;

    JS：

    1
    document.getElementById("hidden-GET").innerHTML;

    简单的哈克斯但工作。

    相关讨论