从“GET”参数（JavaScript）中获取值[重复]

Posted 2023-03-10

【中文标题】从“GET”参数（JavaScript）中获取值[重复]

【英文标题】：Get the values from the "GET" parameters (JavaScript) [duplicate]

【发布时间】：2010-11-02 01:44:40

【问题描述】：

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

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

我需要获取c 的全部值。我试图阅读 URL，但我只得到m2。如何使用 javascript 做到这一点？

【问题讨论】：

在发布新答案之前，请考虑此问题已有 50 多个答案。请确保您的答案提供的信息不在现有答案中。

var url_string = "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");控制台.log(c);

对于 JS 的一个简单问题，应该是什么，需要 50 多个答案，这太疯狂了：/

【参考方案1】：

JavaScript 本身 没有内置用于处理查询字符串参数。

在（现代）浏览器中运行的代码，您可以使用URL object（这是浏览器向 JS 提供的 API 的一部分）：

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），您可以使用 this polyfill 或早于 URL 的此答案的原始版本中的代码：

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

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

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 中获取查询字符串：

var query = window.location.search.substring(1);
var qs = parse_query_string(query);

【讨论】：

对于旧版浏览器，除了URLSearchParams 之外，您可能还需要一个polyfill for URL。或者您可以通过将上面答案中的var c = url.searchParams.get("c"); 行替换为var c = new URLSearchParams(window.location.search).get("c"); 来避免此问题。

parse_query_string 对于包含 '=' 的值将失败，例如将 base64 编码值作为值传递时。下面使用正则表达式的版本效果更好。

@Jamland — 绝对不要那样做。它会破坏事物。 Here is a live demo new URL() 期望接收正确编码的 URL 作为其参数。 decodeURIComponent 期望传递一个 URL 的 组件，而不是整个 URL。

@Quentin 我检查了不同的特殊字符，我发现你是对的。在这种情况下不应使用decodeURIComponent

parse_query_string 函数对value 进行双重解码。 @ManelClos 提到的= 可以通过在vars[i].split() 中添加第二个参数2 (limit) 来解决。

【参考方案2】：

我见过的大多数实现都错过了 URL 解码名称和值。

这是一个通用的实用函数，它也可以进行正确的 URL 解码：

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

【讨论】：

此代码不起作用。它创建了一个无限循环，因为正则表达式是在循环定义中编译的，它会重置当前索引。如果将正则表达式放入循环外的变量中，它可以正常工作。

@maxhawkins：它在某些浏览器中有效，而在其他浏览器中会进入无限循环。在这方面你说对了一半。我会将代码修复为跨浏览器。感谢您指出这一点！

@ZiTAL 此函数用于 URL 的查询部分，而不是整个 URL。请参阅下面的注释掉的用法示例。

@Harvey 不区分大小写不是查询参数的问题。这听起来像是一个特定于应用程序的东西，应该与查询参数提取一起应用，或者在查询参数提取之上应用。

为什么是qs.split('+').join(' '); 而不是qs.replace(/\+/g, ' ');？

【参考方案3】：

source

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

【讨论】：

我最喜欢这个选项，但更喜欢返回 null 或结果，而不是空字符串。

看起来你有一些额外的转义字符。 “\\[“ 应该 ”\[”。由于这些是常规字符串，因此 [ 和 ] 不需要转义。

这不区分大小写。我应该在哪里添加“i”以使其不区分大小写？

alert(gup('UserID', window.location.href));

如果URL中没有参数，结果将为Null并产生错误。在尝试解析数组之前测试 null 可能会更好

【参考方案4】：

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

示例网址：

http://myserver/action?myParam=2

示例 Javascript：

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

如果 URL 中存在“myParam”...变量 myParam 将包含“2”，否则它将是未定义的。

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

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

更新：效果更好：

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 中的最后一个参数时才有效，您不应该依赖该参数（即使您只期望一个参数）。例如http://myserver/action?myParam=2&anotherParam=3 不会产生 "2" 而是 "2&anotherParam=3"。

(location.search.split('myParam=')[1]||'').split('&')[0] -- 与多个参数或可能丢失一起使用myParam。

或location.search.split('myParam=').splice(1).join('').split('&')[0]

您可以通过在[?|&] 前面加上[?|&]myParam=([^&]+) 来获得更高的精度并允许任何参数顺序

你可能需要解码result = decodeURIComponent(result);的值

【参考方案5】：

浏览器供应商已经通过 URL 和 URLSearchParams 实现了一种本地方式来执行此操作。

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。浏览器支持列表see here。

https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams https://developer.mozilla.org/en-US/docs/Web/API/URL/URL

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

Eric Bidelman，Google 的工程师，recommends 将此 polyfill 用于不受支持的浏览器。

【讨论】：

根据 MDN 链接，Safari 支持 URL 但不支持 URLSearchParams。

@Markouver polyfill 没有解决这个问题吗？顺便说一句，Safari 是现代的 IE6

为什么new URLSearchParams("www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5").get('a') 为我返回null？ （在 Chrome 稳定版上）。 b 和 c 似乎运作良好。

更新了答案。我最初的答案没有正确使用 URLSearchParams，因为它只设计用于 URL 的查询字符串部分。

使用url.searchParams 代替new URLSearchParams(url.search)。

【参考方案6】：

我很久以前就发现了这个，非常简单：

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

然后这样称呼它：

var fType = getUrlVars()["type"];

【讨论】：

+1 很棒的解决方案 - 优雅、高效和智能是使用条款。就我而言，比其他公认的解决方案更好

简短 + 简单 + 强大 = 很棒

非常好，它也可以使用 location.search 而不是 window.location.href

@pdxbmw 没用，应该去掉。乍一看，代码可能看起来很聪明，但没有经过深思熟虑。改进：在值上使用decodeURIComponent()，因为这是您通常想要使用的；使用window.location.search 而不是window.location.href，因为你只对参数感兴趣，而不是整个url。

@Leif 的建议效果很好。我输入了一个 ID 142#，因为在 URL 的末尾是在单击按钮时生成的 #。离开这样的功能var vars = ; window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) vars[key] = value; ); return vars;

【参考方案7】：

可以在location.search中获取查询字符串，然后就可以拆分问号后面的所有内容了：

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;

【讨论】：

如何对参数名称和值进行 URL 解码？

这种方法不处理数组。例如。 ?array[]=1&array[]=2 产生 "array[]": "2"，这显然是错误的。

@Kafoso 这里没有明确的对错。首先，同名的重复字段没有指定的标准行为，由解析器来处理。此外，[] 模式仅在某些情况下（例如 PHP）有意义，而在其他情况下没有意义。所以不是“明显错误”——只是没有实施来处理您可能需要或可能不需要处理的非标准案例。

【参考方案8】：

使用URLSearchParams的超级简单方法。

function getParam(param)
  return new URLSearchParams(window.location.search).get(param);

目前在 Chrome、Firefox、Safari、Edge 和 others 中受支持。

【讨论】：

在 Edge 中运行时出现错误：'SCRIPT5009: 'URLSearchParams' is not defined'。

@AndreasPresthammer 什么版本的边缘？

@spencer-sm Microsoft Edge 41.16299.820.0

@iiiml0sto1 什么是“美化 URL 参数”？

【参考方案9】：

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

var arr = document.URL.match(/room=([0-9]+)/)
var room = arr[1];

【讨论】：

看那，两行，正如它在锡上所说的那样 - 如果有人试图探测漏洞并添加一堆额外的字符和查询，它不会中断，不像几个这些解决方案。干杯小伙子！

这可以正确地完成工作，并且仅在 2 行中。很好的答案！

我认为其他检查 null 会很方便。如果没有，这里有一个例子：***.com/a/36076822/1945948（我的编辑尝试被拒绝了）。

不明白...这如何回答这个问题，即从特定字符串 'www.test.com/t.html?a=1&b=3&c=m2 获取参数-m3-m4-m5'?

喜欢这个答案，+1'ed。只是一个建议，您可以将[0-9] 替换为\d

【参考方案10】：

这是一个没有正则表达式的递归解决方案，并且具有最小的突变（只有 params 对象发生了突变，我认为这在 JS 中是不可避免的）。

太棒了，因为它：

是递归的 处理多个同名参数 很好地处理格式错误的参数字符串（缺失值等） 如果 '=' 在值中，则不会中断 执行 URL 解码 最后，它太棒了，因为它......啊！！！

代码：

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

【讨论】：

你……你说了两次递归。

在下一个 url 中找不到第一个参数：www.mysite.com?first=1&second=2

嗨马里奥，这里有一个 JSFiddle 显示它使用该 URL：jsfiddle.net/q6xfJ - 如果您发现错误，这可能是特定于浏览器的吗？测试时，请注意我提供的答案使用 location.search，它是 URL 的 '?first=1&second=2' 部分。干杯:)

我不明白为什么某些东西是好的只是因为它是递归的。

呃，我想你错过了亚当那里的递归笑话。虽然现在每个人都会错过它，因为 edi9999 删除了第二个“Is recursive”。

【参考方案11】：

我做了一个函数：

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

2017 年 5 月 26 日更新，这是一个 ES7 实现（使用 babel 预设阶段 0、1、2 或 3 运行）：

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

一些测试：

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 

2018 年 3 月 26 日更新，这是一个 Typescript 实现：

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

2019 年 2 月 13 日更新，这里是一个更新的 TypeScript 实现，适用于 TypeScript 3。

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

【讨论】：

在没有查询参数的 URL 上，这将返回 Object "": ""

对我来说看起来很干净。剩下的答案太“神奇”了，没有足够的解释。

这是一个很棒的答案！

感谢@SpencerBigum！

【参考方案12】：

See this

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

【参考方案13】：

ECMAScript 6 解决方案：

var params = window.location.search
  .substring(1)
  .split("&")
  .map(v => v.split("="))
  .reduce((map, [key, value]) => map.set(key, decodeURIComponent(value)), new Map())

【讨论】：

不错。仅供参考，因为它是一个地图，所以用法是 params.get("key");

我喜欢它，但它可能不会得到第一个参数。我根据您的示例创建了一个函数function urlParams(url) const [, searchParams = ''] = url.split('?') return searchParams.split('&') .map(v => v.split('=')) .reduce((map, [key = '', value]) => key.length ? map.set(key, decodeURIComponent(value)) : map, new Map())

【参考方案14】：

最短路径：

new URL(location.href).searchParams.get("my_key");

【讨论】：

我更倾向于使用new URL(location.href).searchParams.get("my_key") 而不是URLSearchParams，因为后者在检索任何 URL 的第一个查询参数时都会失败。

测试了两种变体。我同意你的看法。编辑了答案。

这是我在项目中使用的方法

谢谢！我不明白这是怎么回事。

【参考方案15】：

我使用parseUri 库。它允许您完全按照您的要求做：

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'

【参考方案16】：

我用

function getVal(str) 
    var v = window.location.search.match(new RegExp('(?:[\?\&]'+str+'=)([^&]+)'));
    return v ? v[1] : null;

【讨论】：

请添加一些解释。您的答案目前被标记为“低质量”，最终可能会被删除。

我发现如果url末尾有'#id'这样的字符串，返回最后一个参数值'somevalue#id'

@Ayano window.location.search 不会包含像 #id 这样的哈希值。

@Fancyoung 是的，你是对的，我犯了一个错误，使用location.href来匹配结果而不是location.search。谢谢。

【参考方案17】：

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

/**
 * 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];
    , []);

用法：

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

这可以处理空参数（那些没有 "=value" 的键）、标量和基于数组的值检索 API 的公开，以及正确的 URI 组件解码。

【参考方案18】：

这是我的解决方案。正如 Andy E 在回答 this question 时所建议的那样，如果它反复构建各种正则表达式字符串、运行循环等只是为了获得一个值，这对您的脚本的性能不利。所以，我想出了一个更简单的脚本，它在单个对象中返回所有 GET 参数。您应该只调用一次，将结果分配给一个变量，然后在将来的任何时候，使用适当的键从该变量中获取您想要的任何值。请注意，它还负责 URI 解码（即 %20 之类的内容）并将 + 替换为空格：

 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;

所以，这里有一些脚本测试供您查看：

// 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".

【讨论】：

.replace("+", " ") 只会替换第一次出现你需要使用 .replace(/\+/g, " ");

【参考方案19】：

使用replace()方法的最简单方法：

来自urlStr 字符串：

paramVal = urlStr.replace(/.*param_name=([^&]*).*|(.*)/, '$1');

或来自当前的URL：

paramVal = document.URL.replace(/.*param_name=([^&]*).*|(.*)/, '$1');

说明：

document.URL - 接口以字符串形式返回文档位置（页面 url）。 replace() - 方法返回一个新字符串，其中 pattern 的部分或全部匹配被 replacement 替换。 /.*param_name=([^&]*).*/ - 斜线之间的regular expression 模式，表示： .* - 零个或多个任意字符， param_name= - 搜索的参数名称， () - 正则表达式中的组， [^&]* - 除& 之外的任何字符中的一个或多个， | - 交替， $1 - 引用正则表达式中的第一组。

var urlStr = 'www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
var c = urlStr.replace(/.*c=([^&]*).*|(.*)/, '$1');
var notExisted = urlStr.replace(/.*not_existed=([^&]*).*|(.*)/, '$1');
console.log(`c === '$c'`);
console.log(`notExisted === '$notExisted'`);

【讨论】：

不错的解决方案，但是如果找不到参数，则返回整个字符串。在这种情况下，我希望“未定义”。

嗨@pensan，感谢您的精彩评论。我只是在正则表达式中添加了对参数未出现在 URL 中的情况的处理。在这种情况下，我们得到的是空字符串（不是整个字符串）。

【参考方案20】：

还有一个建议。

已经有一些很好的答案，但我发现它们不必要地复杂且难以理解。这是简短的，简单的，并返回一个简单的关联数组，其中键名对应于 URL 中的令牌名称。

我在下面添加了一个带有cmets的版本，供想学习的人使用。

注意，它的循环依赖于 jQuery ($.each)，我推荐使用它而不是 forEach。我发现使用 jQuery 来确保跨浏览器兼容性比插入单独的修复程序来支持旧浏览器不支持的任何新功能更简单。

编辑：在我写完这篇文章后，我注意到 Eric Elliott 的答案几乎相同，尽管它使用了 forEach，而我通常反对（出于上述原因）。

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;

评论版本：

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

对于下面的例子，我们假设这个地址：

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

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

var tokens = getTokens();

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

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

这将打印“4”。

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

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

...将打印“murray”。

【参考方案21】：

或者，如果您不想重新发明 URI 解析轮，请使用 URI.js

获取名为 foo 的参数的值：

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

这是做什么的

将 document.location 转换为字符串（它是一个对象） 将该字符串提供给 URI.js 的 URI 类构造器 调用 search() 函数以获取 url 的搜索（查询）部分 （传递 true 告诉它输出一个对象） 访问结果对象的 foo 属性以获取值

这是一个小提琴......http://jsfiddle.net/m6tett01/12/

【参考方案22】：

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

$(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];

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

$(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
    
 

【讨论】：

我喜欢这个解决方案！

【参考方案23】：

我在这里发布一个例子。但它在 jQuery 中。希望对其他人有所帮助：

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>

<!-- 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"
);
</script>

【讨论】：

复制自您的另一篇文章：“需要 url 插件：plugins.jquery.com/url”

【参考方案24】：

我需要读取一个 URL GET 变量并根据 url 参数完成一个操作。我从高处和低处搜索解决方案，并遇到了这段小代码。它基本上是读取当前页面的url，对url执行一些正则表达式，然后将url参数保存在一个关联数组中，我们可以轻松访问。

例如，如果我们有以下 url，底部有 javascript。

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

我们需要做的就是调用这个参数来获取参数 id 和 page：

代码将是：

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

</script>

【讨论】：

我不明白你为什么回滚我对你的答案的编辑。但是，欢迎您自己改进它:)

【参考方案25】：

// 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

【参考方案26】：

简单的方法

function getParams(url)
        var regex = /[?&]([^=#]+)=([^&#]*)/g,
            params = ,
            match;
        while(match = regex.exec(url)) 
            params[match[1]] = match[2];
        
        return params;
    

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

【参考方案27】：

优雅、实用的风格解决方案

让我们创建一个包含 URL 参数名称作为键的对象，然后我们可以通过其名称轻松提取参数：

// URL: https://example.com/?test=true&orderId=9381  

// Build an object containing key-value pairs
export const queryStringParams = window.location.search
  .split('?')[1]
  .split('&')
  .map(keyValue => keyValue.split('='))
  .reduce<QueryStringParams>((params, [key, value]) => 
    params[key] = value;
    return params;
  , );

type QueryStringParams = 
  [key: string]: string;
;


// Return URL parameter called "orderId"
return queryStringParams.orderId;

【讨论】：

喜欢这个，但如果没有确保在 reduce 函数中返回累加器，对我来说不起作用

@Ella 这是一个错字，没有return就无法工作

现在看起来好多了，希望你能登上第一页！

【参考方案28】：

这是我的工作：

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;

【参考方案29】：

// 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"     

【讨论】：

这会返回第一个带有'?'的参数

【参考方案30】：

This Gist by Eldon McGuinness 是迄今为止我见过的最完整的 JavaScript 查询字符串解析器实现。

不幸的是，它是作为一个 jQuery 插件编写的。

我将它改写为 vanilla JS 并进行了一些改进：

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

另见this Fiddle。

【讨论】：

我对 javascript 的不理解是为什么他们没有将 url 解析函数放入语言本身或至少在标准库中？低级的东西不应该一遍又一遍地重新发明，也不应该让开发人员利用他们将掀起的任何熵变体解决方案。如果这是可靠的，那么应该将这样的东西放入标准库中。这是 javascript 中的一个例子，它让我对这种语言感到厌烦。