如何获取JavaScript中的查询字符串值?


2697

是否有通过jQuery(或不通过jQuery)检索查询字符串值的无插件方法?

如果是这样,怎么办?如果没有,是否有可以做到的插件?


我使用插件getUrlParam中描述jQuery的插件- getUrlParam(版本2)
昏迷

69
一个普通的JavaScript无正则表达式的解决方案:css-tricks.com/snippets/javascript/get-url-variables
洛伦佐·波利多里

6
尽管该问题的最佳解决方案因其不需要jQuery的出色观察而受到欢迎,但其创建新正则表达式并为所需的每个参数重新解析查询字符串的方法效率极低。更为有效(和通用)解决方案已经存在了很长一段时间内,例如,这篇文章转载在这里:htmlgoodies.com/beyond/javascript/article.php/11877_3755006_3/...
约瑟夫·迈尔斯


4
约瑟夫,“不需要jQuery的出色观察”?当然不需要。jQuery所做的一切,都使用JavaScript。人们不使用jQuery,因为它可以完成JavaScript无法做到的事情。jQuery的重点是方便。
弗拉基米尔·科纳

Answers:


8320

更新:2018年9月

您可以使用简单且具有不错(但不完整)浏览器支持的URLSearchParams

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');

原版的

为此,您不需要jQuery。您可以只使用一些纯JavaScript:

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

用法:

// query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
var bar = getParameterByName('bar'); // "" (present with empty value)
var baz = getParameterByName('baz'); // "" (present with no value)
var qux = getParameterByName('qux'); // null (absent)


注意:如果一个参数多次出现(?foo=lorem&foo=ipsum),您将获得第一个值(lorem)。对此没有标准,用法也有所不同,例如参见以下问题:重复的HTTP GET查询键的权威位置
注意:该功能区分大小写。如果您希望使用不区分大小写的参数名称,请在RegExp中添加'i'修饰符


这是基于新的URLSearchParams规范的更新,目的是更简洁地达到相同的结果。请参阅下面标题为“ URLSearchParams ”的答案。


131
此函数如何处理http://www.mysite.com/index.php?x=x1&x=x2&x=x3字段的值x不明确。
dpp

94
这也不能处理多值键,这也是完全合法的。
hurrymaplelad 2011年

17
为什么要为此使用正则表达式?
Ry-

28
对于的querystring ?mykey=0&m.+key=1,调用getParameterByName("m.+key")将返回0而不是1name在构建正则表达式之前,您需要转义正则表达式元字符。您只需要.replace()使用全局标志并将其"\\$&"用作替换表达式即可调用一次。您应该搜索location.search而不是location.href。答案超过400的应解释这些细节。
gilly3 2011年

7
您不需要jQuery来实现此目的或任何其他目的。您只是实际上并不需要它。
gztomas

1707

此处发布的某些解决方案效率低下。完全不需要每次脚本需要访问参数时都重复进行正则表达式搜索,只需一个函数即可将参数拆分为一个关联数组样式的对象。如果您不使用HTML 5历史记录API,则每个页面加载仅需要一次。此处的其他建议也无法正确解码URL。

var urlParams;
(window.onpopstate = function () {
    var match,
        pl     = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
        query  = window.location.search.substring(1);

    urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
})();

示例查询字符串:

?i=main&mode=front&sid=de8d49b78a85a322c4155015fdce22c4&enc=+Hello%20&empty

结果:

 urlParams = {
    enc: " Hello ",
    i: "main",
    mode: "front",
    sid: "de8d49b78a85a322c4155015fdce22c4",
    empty: ""
}

alert(urlParams["mode"]);
// -> "front"

alert("empty" in urlParams);
// -> true

这也可以很容易地改进以处理数组样式的查询字符串。这方面的一个例子是在这里,但由于阵列式的参数没有定义RFC 3986我不会污染这个答案的源代码。对于那些对“污染”版本感兴趣的人,请查看下面的Campbeln的答案

另外,正如评论中指出的那样,它;key=value成对的合法分隔符。这将需要更复杂的正则表达式来处理;&,我认为这是不必要的,因为很少;使用正则表达式,而且我说这两种情况都不太可能使用。如果您需要支持;而不是&,只需在正则表达式中交换它们即可。


如果您使用服务器端预处理语言,则可能要使用其本机JSON函数为您完成繁重的工作。例如,在PHP中,您可以编写:

<script>var urlParams = <?php echo json_encode($_GET, JSON_HEX_TAG);?>;</script>

简单得多!

更新

一种新功能将是检索重复的参数,如下所示myparam=1&myparam=2。没有规范,但是,大多数当前方法遵循数组的生成。

myparam = ["1", "2"]

因此,这是管理它的方法:

let urlParams = {};
(window.onpopstate = function () {
    let match,
        pl = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) {
            return decodeURIComponent(s.replace(pl, " "));
        },
        query = window.location.search.substring(1);

    while (match = search.exec(query)) {
        if (decode(match[1]) in urlParams) {
            if (!Array.isArray(urlParams[decode(match[1])])) {
                urlParams[decode(match[1])] = [urlParams[decode(match[1])]];
            }
            urlParams[decode(match[1])].push(decode(match[2]));
        } else {
            urlParams[decode(match[1])] = decode(match[2]);
        }
    }
})();

11
如果您正在做一个大量的ajax应用程序,那么您可能正在使用hash(#)“启用后退按钮” ...在这种情况下,查询字符串将一直更改(请参阅facebook的操作方式)。 ..尽管这些解决方案忽略了#离开之后发生的事情...
Nick Franceschina 2010年

100
@Nick:哈希值之后的任何内容都位于window.location.hash属性中,该属性与属性分开window.location.search。如果哈希值发生变化,则完全不会影响查询字符串。
安迪E

27
不要忘记,这;是GET 对的合法分隔符key=value。这种情况很少见,但实施需要5秒钟。
Alex

4
公平地说,RFC3986没有定义查询字符串的特定格式。 ?a=b&c=d是常规的,并且是Web表单的W3C建议,但URI规范仅定义了query = *( pchar / "/" / "?" )
马修·吉利亚德

21
对于我们这些使用while(match = search.exec(query))while((match = search.exec(query)) !== null)
JSHint

1282

ES2015(ES6)

getQueryStringParams = query => {
    return query
        ? (/^[?#]/.test(query) ? query.slice(1) : query)
            .split('&')
            .reduce((params, param) => {
                    let [key, value] = param.split('=');
                    params[key] = value ? decodeURIComponent(value.replace(/\+/g, ' ')) : '';
                    return params;
                }, {}
            )
        : {}
};

没有jQuery

var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i)
    {
        var p=a[i].split('=', 2);
        if (p.length == 1)
            b[p[0]] = "";
        else
            b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
})(window.location.search.substr(1).split('&'));

使用类似的URL ?topic=123&name=query+string,将返回以下内容:

qs["topic"];    // 123
qs["name"];     // query string
qs["nothere"];  // undefined (object)

谷歌方法

撕毁Google的代码后,我发现了他们使用的方法: getUrlParameters

function (b) {
    var c = typeof b === "undefined";
    if (a !== h && c) return a;
    for (var d = {}, b = b || k[B][vb], e = b[p]("?"), f = b[p]("#"), b = (f === -1 ? b[Ya](e + 1) : [b[Ya](e + 1, f - e - 1), "&", b[Ya](f + 1)][K](""))[z]("&"), e = i.dd ? ia : unescape, f = 0, g = b[w]; f < g; ++f) {
        var l = b[f][p]("=");
        if (l !== -1) {
            var q = b[f][I](0, l),
                l = b[f][I](l + 1),
                l = l[Ca](/\+/g, " ");
            try {
                d[q] = e(l)
            } catch (A) {}
        }
    }
    c && (a = d);
    return d
}

它被混淆了,但是可以理解。它不起作用,因为某些变量未定义。

他们开始?从散列中以及从散列中寻找URL上的参数#。然后,对于每个参数,它们以等号分隔b[f][p]("=")(看起来像indexOf,它们使用char的位置来获取键/值)。将其拆分后,他们将检查参数是否具有值,如果具有则存储参数的值d,否则将继续。

最后,d返回对象,处理转义和+符号。这个对象就像我的一样,具有相同的行为。


我作为jQuery插件的方法

(function($) {
    $.QueryString = (function(paramsArray) {
        let params = {};

        for (let i = 0; i < paramsArray.length; ++i)
        {
            let param = paramsArray[i]
                .split('=', 2);

            if (param.length !== 2)
                continue;

            params[param[0]] = decodeURIComponent(param[1].replace(/\+/g, " "));
        }

        return params;
    })(window.location.search.substr(1).split('&'))
})(jQuery);

用法

//Get a param
$.QueryString.param
//-or-
$.QueryString["param"]
//This outputs something like...
//"val"

//Get all params as object
$.QueryString
//This outputs something like...
//Object { param: "val", param2: "val" }

//Set a param (only in the $.QueryString object, doesn't affect the browser's querystring)
$.QueryString.param = "newvalue"
//This doesn't output anything, it just updates the $.QueryString object

//Convert object into string suitable for url a querystring (Requires jQuery)
$.param($.QueryString)
//This outputs something like...
//"param=newvalue&param2=val"

//Update the url/querystring in the browser's location bar with the $.QueryString object
history.replaceState({}, '', "?" + $.param($.QueryString));
//-or-
history.pushState({}, '', "?" + $.param($.QueryString));

性能测试(针对正则表达式的拆分方法)jsPerf

准备代码:方法声明

拆分测试代码

var qs = window.GetQueryString(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];

正则表达式测试代码

var search = window.getParameterByName("q");
var value = window.getParameterByName("value");
var undef = window.getParameterByName("undefinedstring");

在Windows Server 2008 R2 / 7 x64上的Firefox 4.0 x86中进行测试

  • 拆分方法:最快144,780±2.17%
  • 正则表达式方法:13,891±0.85%| 慢90%

1
这也是一种很好的方法,可以使用字符串拆分而不是使用正则表达式。但是,有一些事情值得指出:-) 1. unescape是一个已弃用的函数,并被替换为decodeURIComponent(),请注意,这些函数都不能正确将a解码+为空格字符。2.您应该将结果声明为一个对象,而不是一个数组,因为JavaScript本身没有关联数组,并且通过向其声明命名的属性仍然可以将您声明的数组视为对象。
Andy E 2010年

55
很好奇为什么当它没有任何jQuery特定代码时,为什么要使它成为jQuery插件?
zachleat 2011年

63
@zachleat如果您没有框架,您的功能只会在您的代码中散布。如果扩展jQuery,则将具有函数的作用域,它不会在代码中的任何位置浮动。我认为这是唯一原因。
BrunoLM 2011年

6
这是经过调整以通过JSLint 的jQuery版本(至少在2011-06-15年成为JSLint.com的半移动目标)。通常只是为了安抚The Crockford而搬家。
2011年

3
正如@BenjaminGruenbaum开玩笑说的那样,我对基准URL解析性能的基准测试也不太了解。如果将其制成同构JavaScript模块,可以从Node调用它,例如解析日志,则可以。但是window.location,考虑到客户端导航到该URL的成本要高得多,因此使用它来从中提取URL参数不会引起任何性能问题。
Dan Dascalescu 2015年

659

Artem Barger答案的改进版本:

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

有关改进的更多信息,请参见:http : //james.padolsey.com/javascript/bujs-1-getparameterbyname/


23
如果您想将其缩短一些,可以取消三元条件,并在最后一行-上用一些短路代替它return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
安迪E

null如果参数后面没有'=' ,则返回该参数。你可以预先准备if (!RegExp('[?&]'+name+'(&.*)?$').exec(window.location.search)) return false;,使其返回boolean false如果在所有参数心不是在那里。
commonpike 2012年

9
new创建正则表达式时将使用前缀:var match = new RegExp('...
Patrick Berkeley

2
IE11错误:IE决定在返回的值前加上ascii字符8206(十六进制:200E-“从左至右字符”)。我浪费了超过6个小时才找到这个!治疗性排气 ....固定,固定在最后一行的末端:.replace('\u200E', '')
JayRO-GreyBeard 2015年

至少在Mac上的Chrome中(也许其他浏览器也是如此),最后一个值附加了'/'。因此,我修改了正则表达式以忽略它。var results = new RegExp('[\\?&]' + name + '=([^&#/]*)').exec(url);
CaseyB'1

594

URLSearchParams

火狐44+,歌剧36+,边缘17+,Safari浏览器10.3+和Chrome 49+支持URLSearchParams API:

对于IE的稳定版本,有一个Google建议的URLSearchParams polyfill

它不是W3C标准化的,而是WhatWG的生活标准。

您可以在location以下位置使用它:

let params = new URLSearchParams(location.search);

要么

let params = (new URL(location)).searchParams;

或当然在任何URL上:

let url = new URL('https://example.com?foo=1&bar=2');
let params = new URLSearchParams(url.search);

您还可以使用.searchParamsURL对象的简写属性来获取参数,如下所示:

let params = new URL('https://example.com?foo=1&bar=2').searchParams;
params.get('foo'); // "1"
params.get('bar'); // "2" 

您通过读/设置参数get(KEY)set(KEY, VALUE)append(KEY, VALUE)API。您还可以遍历所有值for (let p of params) {}

一个参考实现示例页面都可以审核和测试。


那两个.get.
拒绝投票的人

20
您实际上不需要slice(1)打开.search,您可以直接使用它。URLSearchParams可以处理前导?
杰森C

URLSearchParams这是不好的,因为它不返回URL参数的实际值。
Melab

new URL('https://example.com?foo=1&bar=2') 不适用于android网址file:///android_asset/...
莎阿

@Melab仍然很好,因为它为这里其他答案中所有奇怪的正则表达式提供了一个简单的API。但这也让我感到奇怪的是,默认情况下,id不会执行window.location.search,并且无法更新当前包含的网址。
戴蒙

400

只是另一个建议。插件Purl允许检索URL的所有部分,包括锚点,主机等。

它可以与或不与jQuery一起使用。

用法非常简单和酷:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value'); // jQuery version
var url = purl('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

然而,随着2014年11月11日的,金银丝是不再保持,笔者建议使用URI.js代替。jQuery插件的不同之处在于它侧重于元素-用于字符串,可以URI直接使用,无论是否使用jQuery。类似的代码看起来像这样,更完整的文档在这里

var url = new URI('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.protocol(); // returns 'http'
url.path(); // returns '/folder/dir/index.html'

7
在撰写本文时,不再维护purl
Dan Pantry

238

tl; dr

一种快速,完整的解决方案,可以处理多值键编码字符

var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {var s = item.split("="), k = s[0], v = s[1] && decodeURIComponent(s[1]); (qd[k] = qd[k] || []).push(v)})

//using ES6   (23 characters cooler)
var qd = {};
if (location.search) location.search.substr(1).split`&`.forEach(item => {let [k,v] = item.split`=`; v = v && decodeURIComponent(v); (qd[k] = qd[k] || []).push(v)})
多行:
var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {
    var s = item.split("="),
        k = s[0],
        v = s[1] && decodeURIComponent(s[1]); //  null-coalescing / short-circuit
    //(k in qd) ? qd[k].push(v) : qd[k] = [v]
    (qd[k] = qd[k] || []).push(v) // null-coalescing / short-circuit
})

这些代码是什么...
“ null-coalescing”短路评估
ES6 销毁分配箭头功能模板字符串

例:
"?a=1&b=0&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"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

> qd.a[1]    // "5"
> qd["a"][1] // "5"



阅读更多关于Vanilla JavaScript解决方案的信息。

要访问URL的不同部分,请使用 location.(search|hash)

最简单的(虚拟)解决方案

var queryDict = {};
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})
  • 正确处理空键
  • 用找到的最后一个值覆盖多键
"?a=1&b=0&c=3&d&e&a=5"
> queryDict
a: "5"
b: "0"
c: "3"
d: undefined
e: undefined

多值键

简单的按键检查 (item in dict) ? dict.item.push(val) : dict.item = [val]

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {(item.split("=")[0] in qd) ? qd[item.split("=")[0]].push(item.split("=")[1]) : qd[item.split("=")[0]] = [item.split("=")[1]]})
  • 现在返回数组
  • 通过qd.key[index]或访问值qd[key][index]
> qd
a: ["1", "5"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined]

编码字符?

使用decodeURIComponent()第二个或两个分裂。

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {var k = item.split("=")[0], v = decodeURIComponent(item.split("=")[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v]})
例:
"?a=1&b=0&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"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: ["undefined"]  // decodeURIComponent(undefined) returns "undefined" !!!*
e: ["undefined", "http://w3schools.com/my test.asp?name=ståle&car=saab"]



来自评论

* !!! 请注意,它decodeURIComponent(undefined)返回string "undefined"。解决方案在于的简单用法&&,以确保decodeURIComponent()不会在未定义的值上调用。(请参见顶部的“完整解决方案”。)

v = v && decodeURIComponent(v);


如果querystring为空(location.search == ""),则结果会产生误导qd == {"": undefined}。建议像下面这样启动解析功能之前检查查询字符串:

if (location.search) location.search.substr(1).split("&").forEach(...)

1
真好 我唯一要更改的是-如果一个键的值不超过一个,则无需将其作为数组。如果每个键有多个值,则仅使用数组。
Pavel Nikolov 2014年

2
@PavelNikolov我认为,有时获取数组和有时获取值会带来困难。您必须先检查它,现在只检查长度,因为无论如何您将使用循环来检索这些值。同样,这也是这里最简单但实用的解决方案。
Qwerty 2014年

@katsh是的,它确实可以在> = IE9中工作,但是,您可以array.forEach()通过在脚本开始处注入某些代码来教您的javascript处理器。看到填充工具developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
Qwerty全

1
为了提高可读性,对其进行了整理,使其成为一个函数,并重新使用了拆分调用:function parseQueryString(){var qd = {}; location.search.substr(1).split(“&”)。forEach(function(item){var parts = item.split(“ =”); var k = parts [0]; var v = encodeURIComponent(parts [ 1]);(k in qd)?qd [k] .push(v):qd [k] = [v,]});返回qd; }
Casey 2015年

1
encodeDocumentURI(undefined)返回“ undefined”,而不是未定义。一个实用但不十分优雅的补丁: var qd = {}; location.search.substr(1).split("&").forEach( function(item) { var s = item.split("="), k = s[0], v; if(s.length>1) v = decodeURIComponent(s[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v] })
循环

218

snipplr.com上的Roshambo有​​一个简单的脚本来实现此目的,如使用jQuery |使用URL获取参数中所述。改进了。使用他的脚本,您还可以轻松提取所需的参数。

这是要点:

$.urlParam = function(name, url) {
    if (!url) {
     url = window.location.href;
    }
    var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(url);
    if (!results) { 
        return undefined;
    }
    return results[1] || undefined;
}

然后只需从查询字符串中获取参数即可。

因此,如果URL /查询字符串是xyz.com/index.html?lang=de

只需致电var langval = $.urlParam('lang');,您就知道了。

UZBEKJON对此也有很棒的博客文章,使用jQuery获取URL参数和值


13
使用jQuery似乎意味着将功能命名为jQuery对象。另外,为什么是无效值0?当然,我可以使用严格的相等性检查,但不是null吗?
alex 2012年

同意 这种方式就像普通的javascript变量引用一样工作(除非返回undefined会更准确)。
同步

'name'不能正确转义,只是直接注入到RegExp中。这失败了。就像其他人说的那样,当应该在一个经过良好测试的库中实现这些答案时,令人难以置信的是,这些答案正在重新发明轮子并获得大量投票。
Triynko

167

如果您使用的是jQuery,则可以使用一个库,例如jQuery BBQ:Back Button&Query Library

... jQuery BBQ提供了完整的.deparam()方法,以及哈希状态管理,片段/查询字符串解析和合并实用程序方法。

编辑:添加Deparam示例:

 var DeparamExample = function() {
            var params = $.deparam.querystring();

            //nameofparam is the name of a param from url
            //code below will get param if ajax refresh with hash
            if (typeof params.nameofparam == 'undefined') {
                params = jQuery.deparam.fragment(window.location.href);
            }
            
            if (typeof params.nameofparam != 'undefined') {
                var paramValue = params.nameofparam.toString();
                  
            }
        };

如果您只想使用纯JavaScript,可以使用...

var getParamValue = (function() {
    var params;
    var resetParams = function() {
            var query = window.location.search;
            var regex = /[?&;](.+?)=([^&;]+)/g;
            var match;

            params = {};

            if (query) {
                while (match = regex.exec(query)) {
                    params[match[1]] = decodeURIComponent(match[2]);
                }
            }    
        };

    window.addEventListener
    && window.addEventListener('popstate', resetParams);

    resetParams();

    return function(param) {
        return params.hasOwnProperty(param) ? params[param] : null;
    }

})();​

由于使用了新的HTML历史记录API,特别是history.pushState()history.replaceState(),因此URL可以更改,这将使参数及其值的缓存无效。

每次更改历史记录时,此版本都会更新其内部参数缓存。


100

只需使用两个拆分

function get(n) {
    var half = location.search.split(n + '=')[1];
    return half !== undefined ? decodeURIComponent(half.split('&')[0]) : null;
}

我正在阅读所有以前的和更完整的答案。但是我认为这是最简单,最快的方法。您可以检查此jsPerf 基准测试

要解决Rup注释中的问题,请通过将第一行更改为下面的两行来添加条件拆分。但是绝对精度意味着它现在比regexp慢(请参阅jsPerf)。

function get(n) {
    var half = location.search.split('&' + n + '=')[1];
    if (!half) half = location.search.split('?' + n + '=')[1];
    return half !== undefined ? decodeURIComponent(half.split('&')[0]) : null;
}

因此,如果您知道您不会碰到Rup的反案,那就赢了。否则,使用正则表达式。

或者,如果您可以控制查询字符串,并且可以保证您尝试获取的值永远不会包含任何URL编码的字符(将它们包含在值中将是一个坏主意)-您可以使用以下稍微简化和易读的版本第一种选择:

    function getQueryStringValueByName(name) {
        var queryStringFromStartOfValue = location.search.split(name + '=')[1];
         return queryStringFromStartOfValue !== undefined ? queryStringFromStartOfValue.split('&')[0] : null;

7
井井有条!但是,如果您有一个较早的值且其键名以所需的键名结尾(例如get('value')on),则此方法将无效http://the-url?oldvalue=1&value=2
Rup 2012年

3
但是,如果您知道参数名称是期望的,这将是更快的方法。
马丁·博西里

编辑:如果您只测试half真实性,则对于空参数(如)返回null ?param=。在这种情况下,它应该返回空字符串,检查half !== undefined可以解决。
philh 2014年

凉!我做了一个function get(param){return decodeURIComponent((location.search.split(param+'=')[1]||'').split('&')[0])}
单线

return half !== undefined ? decodeURIComponent(half[1].split('&')[0]) : null;为了使它正常工作,我不得不更改第二行
divillysausages 2015年

95

这是我将Andy E的出色解决方案制作成完整的jQuery插件的一种尝试:

;(function ($) {
    $.extend({      
        getQueryString: function (name) {           
            function parseParams() {
                var params = {},
                    e,
                    a = /\+/g,  // Regex for replacing addition symbol with a space
                    r = /([^&=]+)=?([^&]*)/g,
                    d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
                    q = window.location.search.substring(1);

                while (e = r.exec(q))
                    params[d(e[1])] = d(e[2]);

                return params;
            }

            if (!this.queryStringParams)
                this.queryStringParams = parseParams(); 

            return this.queryStringParams[name];
        }
    });
})(jQuery);

语法为:

var someVar = $.getQueryString('myParam');

两全其美!


76

如果您要进行的URL操作不仅仅是简单地解析查询字符串,那么URI.js可能会有所帮助。它是一个用于处理URL的库-带有所有的功能。(很抱歉在这里进行自我广告)

将您的查询字符串转换为地图:

var data = URI('?foo=bar&bar=baz&foo=world').query(true);
data == {
  "foo": ["bar", "world"],
  "bar": "baz"
}

(URI.js也“修复”坏查询字符串喜欢?&foo&&bar=baz&?foo&bar=baz


//需要加载src / URI.fragmentURI.js
JoeB 2013年

1
+1 URI.js是一个很棒的小插件。您也可以var data = URI.parseQuery('?foo=bar&bar=baz&foo=world');为相同的结果(docs)做。
Yarin

62

我喜欢 Ryan Phelan的解决方案。但是我没有看到为此扩展jQuery的任何意义?没有使用jQuery功能。

另一方面,我喜欢Google Chrome中的内置功能:window.location.getParameter。

那么为什么不使用它呢?好的,其他浏览器没有。因此,如果此函数不存在,请创建它:

if (!window.location.getParameter ) {
  window.location.getParameter = function(key) {
    function parseParams() {
        var params = {},
            e,
            a = /\+/g,  // Regex for replacing addition symbol with a space
            r = /([^&=]+)=?([^&]*)/g,
            d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
            q = window.location.search.substring(1);

        while (e = r.exec(q))
            params[d(e[1])] = d(e[2]);

        return params;
    }

    if (!this.queryStringParams)
        this.queryStringParams = parseParams(); 

    return this.queryStringParams[key];
  };
}

此功能或多或少与Ryan Phelan相同,但其包装方式有所不同:名称清晰且不依赖其他javascript库。有关此功能的更多信息,请访问我的博客


3
看起来window.location.getParameter()已从Chrome中删除。
mhenry1384 2014年

54

这是获取类似于PHP $ _GET数组的对象的快速方法:

function get_query(){
    var url = location.search;
    var qs = url.substring(url.indexOf('?') + 1).split('&');
    for(var i = 0, result = {}; i < qs.length; i++){
        qs[i] = qs[i].split('=');
        result[qs[i][0]] = decodeURIComponent(qs[i][1]);
    }
    return result;
}

用法:

var $_GET = get_query();

对于查询字符串,x=5&y&z=hello&x=6它返回对象:

{
  x: "6",
  y: undefined,
  z: "hello"
}

如果您需要将其用作jQuery插件,则为:(function($) { $.extend({ get_query: function (name) { var url = location.href; var qs = url.substring(url.indexOf('?') + 1).split('&'); for(var i = 0, result = {}; i < qs.length; i++){ qs[i] = qs[i].split('='); result[qs[i][0]] = qs[i][1]; } return result; } }); })(jQuery);并使用如下代码:$.get_query()
tim

谢谢。我也最终使用了这个。我在您的return语句之前添加了它:if(param)return result [param],这样,如果需要,我也可以执行get_query('foo')
sqram

1
如果您有哈希,则无法正常工作。例如:test.aspx?test = t1#default。将返回{test:“ t1#default”},我希望{test:“ t1”}
Bogdan M.

@BogdanM:的确如此。location.href将必须替换为location.search
Dan Dascalescu 2015年

53

用普通的JavaScript代码保持简单:

function qs(key) {
    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[key];
}

从JavaScript代码中的任何位置调用它:

var result = qs('someKey');

1
我认为您正在做与我类似的事情,但我认为我的方法要简单得多stackoverflow.com/a/21152762/985454
Qwerty

让我向您介绍一下(请打鼓)window.location.search
ErikE

46

这些都是很好的答案,但是我需要更强大的功能,并认为大家可能都想拥有我创造的东西。

这是一种简单的库方法,可以剖析和处理URL参数。静态方法具有以下可以在主题URL上调用的子方法:

  • getHost
  • getPath
  • getHash
  • setHash
  • getParams
  • getQuery
  • setParam
  • getParam
  • hasParam
  • removeParam

例:

URLParser(url).getParam('myparam1')

var url = "http://www.test.com/folder/mypage.html?myparam1=1&myparam2=2#something";

function URLParser(u){
    var path="",query="",hash="",params;
    if(u.indexOf("#") > 0){
        hash = u.substr(u.indexOf("#") + 1);
        u = u.substr(0 , u.indexOf("#"));
    }
    if(u.indexOf("?") > 0){
        path = u.substr(0 , u.indexOf("?"));
        query = u.substr(u.indexOf("?") + 1);
        params= query.split('&');
    }else
        path = u;
    return {
        getHost: function(){
            var hostexp = /\/\/([\w.-]*)/;
            var match = hostexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getPath: function(){
            var pathexp = /\/\/[\w.-]*(?:\/([^?]*))/;
            var match = pathexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getHash: function(){
            return hash;
        },
        getParams: function(){
            return params
        },
        getQuery: function(){
            return query;
        },
        setHash: function(value){
            if(query.length > 0)
                query = "?" + query;
            if(value.length > 0)
                query = query + "#" + value;
            return path + query;
        },
        setParam: function(name, value){
            if(!params){
                params= new Array();
            }
            params.push(name + '=' + value);
            for (var i = 0; i < params.length; i++) {
                if(query.length > 0)
                    query += "&";
                query += params[i];
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
        getParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return decodeURIComponent(pair[1]);
                }
            }
            console.log('Query variable %s not found', name);
        },
        hasParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return true;
                }
            }
            console.log('Query variable %s not found', name);
        },
        removeParam: function(name){
            query = "";
            if(params){
                var newparams = new Array();
                for (var i = 0;i < params.length;i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) != name)
                          newparams .push(params[i]);
                }
                params = newparams;
                for (var i = 0; i < params.length; i++) {
                    if(query.length > 0)
                        query += "&";
                    query += params[i];
                }
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
    }
}


document.write("Host: " + URLParser(url).getHost() + '<br>');
document.write("Path: " + URLParser(url).getPath() + '<br>');
document.write("Query: " + URLParser(url).getQuery() + '<br>');
document.write("Hash: " + URLParser(url).getHash() + '<br>');
document.write("Params Array: " + URLParser(url).getParams() + '<br>');
document.write("Param: " + URLParser(url).getParam('myparam1') + '<br>');
document.write("Has Param: " + URLParser(url).hasParam('myparam1') + '<br>');

document.write(url + '<br>');

// Remove the first parameter
url = URLParser(url).removeParam('myparam1');
document.write(url + ' - Remove the first parameter<br>');

// Add a third parameter
url = URLParser(url).setParam('myparam3',3);
document.write(url + ' - Add a third parameter<br>');

// Remove the second parameter
url = URLParser(url).removeParam('myparam2');
document.write(url + ' - Remove the second parameter<br>');

// Add a hash
url = URLParser(url).setHash('newhash');
document.write(url + ' - Set Hash<br>');

// Remove the last parameter
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove the last parameter<br>');

// Remove a parameter that doesn't exist
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove a parameter that doesn\"t exist<br>');

44

MDN

function loadPageVar (sVar) {
  return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
}

alert(loadPageVar("name"));

39

高尔夫代码:

var a = location.search&&location.search.substr(1).replace(/\+/gi," ").split("&");
for (var i in a) {
    var s = a[i].split("=");
    a[i]  = a[unescape(s[0])] = unescape(s[1]);
}

显示它!

for (i in a) {
    document.write(i + ":" + a[i] + "<br/>");   
};

在我的Mac上:test.htm?i=can&has=cheezburger显示

0:can
1:cheezburger
i:can
has:cheezburger

9
我喜欢您的回答,尤其是脚本的紧凑程度,但是您应该使用解码URIComponent。见xkr.us/articles/javascript/encode-comparestackoverflow.com/questions/619323/...
pluckyglen

39

我经常使用正则表达式,但并非如此。

对于我来说,在应用程序中读取一次查询字符串,然后从所有键/值对构建对象似乎更容易,更高效,例如:

var search = function() {
  var s = window.location.search.substr(1),
    p = s.split(/\&/), l = p.length, kv, r = {};
  if (l === 0) {return false;}
  while (l--) {
    kv = p[l].split(/\=/);
    r[kv[0]] = decodeURIComponent(kv[1] || '') || true;
  }
  return r;
}();

对于类似的URL,http://domain.com?param1=val1&param2=val2您可以稍后在代码中使用search.param1和获得它们的值search.param2


38
function GET() {
        var data = [];
        for(x = 0; x < arguments.length; ++x)
            data.push(location.href.match(new RegExp("/\?".concat(arguments[x],"=","([^\n&]*)")))[1])
                return data;
    }


example:
data = GET("id","name","foo");
query string : ?id=3&name=jet&foo=b
returns:
    data[0] // 3
    data[1] // jet
    data[2] // b
or
    alert(GET("id")[0]) // return 3

5
这是一种有趣的方法,它返回一个包含指定参数值的数组。它确实至少有一个问题-无法正确地对值进行URL解码,并且还需要对匹配中使用的参数名称进行URL编码。但是它将以当前形式在简单查询字符串上起作用。 psfor语句中声明变量时不要忘记使用var关键字。
Andy E

38

Roshambo jQuery方法未处理解码URL

http://snipplr.com/view/26662/get-url-parameters-with-jquery--improved/

刚刚在添加return语句时也添加了该功能

return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;

现在您可以找到更新的要点:

$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (!results) { return 0; }
return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;
}

36

我喜欢这个(取自jquery-howto.blogspot.co.uk):

// get an array with all querystring values
// example: var valor = getUrlVars()["valor"];
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;
}

对我来说很棒。


36

这是我对这个出色答案的编辑-增强了使用没有值的键解析查询字符串的功能。

var url = 'http://sb.com/reg/step1?param';
var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i) {
        var p=a[i].split('=', 2);
        if (p[1]) p[1] = decodeURIComponent(p[1].replace(/\+/g, " "));
        b[p[0]] = p[1];
    }
    return b;
})((url.split('?'))[1].split('&'));

重要!最后一行中该函数的参数不同。这只是一个如何向其传递任意URL的示例。您可以使用Bruno回答的最后一行来解析当前URL。

那么到底发生了什么变化?使用url的http://sb.com/reg/step1?param=结果将相同。但是使用url时,http://sb.com/reg/step1?paramBruno的解决方案返回一个没有键的对象,而我的返回一个带有键paramundefined值的对象。


34

我需要查询字符串中的对象,并且我讨厌很多代码。它可能不是Universe中最强大的,但是只有几行代码。

var q = {};
location.href.split('?')[1].split('&').forEach(function(i){
    q[i.split('=')[0]]=i.split('=')[1];
});

像这样的URL this.htm?hello=world&foo=bar将创建:

{hello:'world', foo:'bar'}

4
整齐。但是根据Mozilla的说法,forEach不能在IE7或8上运行,而且我怀疑如果根本没有查询字符串,那将会失败。一种可以覆盖更多情况的最小改进是decodeURIComponent存储它的值-可以说是密钥,但是在其中使用奇数字符串的可能性较小。
Rup

1
漂亮又简单。不处理数组参数,?a&b&c但它确实非常易读(顺便说一句类似于我的第一个想法)。也是split多余的,但是我要比将10个字符串分割两次更能提高性能。
cod3monk3y 2014年

1
当querystring为“?hello = world&one = a = b&two = 2”时,那么当您获取'one'的值时,您只会在该值的第一个'='之前得到该零件。它的值应该为'a = b',但您只会得到'a',因为您在'='上分割了'one = a = b'。这简直是​​越野车。:((
肖恩·科瓦奇

2
我会使用location.search.substr(1)而不是location.href.split('?')[1]避免#anchor与最后一个查询参数一起使用hash()。
2016年

是的,让我也向您介绍location.search
ErikE

32

这是Andy E链接的“处理数组样式的查询字符串”-版本的扩展版本。修复了一个错误(?key=1&key[]=2&key[]=3; 1丢失并替换为[2,3]),对性能做了一些小的改进(重新解码值,重新计算“ [”位置等),并增加了一些改进(功能化,支持?key=1&key=2,支持;定界符) 。我烦人地将变量简短地留了下来,但是添加了大量的注释以使它们易于阅读(哦,我v在局部函数中重用了,抱歉,否则;)。

它将处理以下查询字符串...

?test = Hello&person = neek&person [] = jeff&person [] = jim&person [extra] = john&test3&nocache = 1398914891264

...使其成为看起来像...的对象

{
    "test": "Hello",
    "person": {
        "0": "neek",
        "1": "jeff",
        "2": "jim",
        "length": 3,
        "extra": "john"
    },
    "test3": "",
    "nocache": "1398914891264"
}

如您在上面看到的,此版本处理“格式错误”数组的某种度量,即- person=neek&person[]=jeff&person[]=jimperson=neek&person=jeff&person=jim因为键是可识别且有效的(至少在dotNet的NameValueCollection.Add中):

如果指定的键已经存在于目标NameValueCollection实例中,则将指定的值以“ value1,value2,value3”的形式添加到现有的逗号分隔值列表中。

由于没有规范,似乎陪审团似乎对重复的按键有些犹豫。在这种情况下,多个密钥存储为(伪)数组。但是请注意,我不会将基于逗号的值处理为数组。

编码:

getQueryStringKey = function(key) {
    return getQueryStringAsObject()[key];
};


getQueryStringAsObject = function() {
    var b, cv, e, k, ma, sk, v, r = {},
        d = function (v) { return decodeURIComponent(v).replace(/\+/g, " "); }, //# d(ecode) the v(alue)
        q = window.location.search.substring(1), //# suggested: q = decodeURIComponent(window.location.search.substring(1)),
        s = /([^&;=]+)=?([^&;]*)/g //# original regex that does not allow for ; as a delimiter:   /([^&=]+)=?([^&]*)/g
    ;

    //# ma(make array) out of the v(alue)
    ma = function(v) {
        //# If the passed v(alue) hasn't been setup as an object
        if (typeof v != "object") {
            //# Grab the cv(current value) then setup the v(alue) as an object
            cv = v;
            v = {};
            v.length = 0;

            //# If there was a cv(current value), .push it into the new v(alue)'s array
            //#     NOTE: This may or may not be 100% logical to do... but it's better than loosing the original value
            if (cv) { Array.prototype.push.call(v, cv); }
        }
        return v;
    };

    //# While we still have key-value e(ntries) from the q(uerystring) via the s(earch regex)...
    while (e = s.exec(q)) { //# while((e = s.exec(q)) !== null) {
        //# Collect the open b(racket) location (if any) then set the d(ecoded) v(alue) from the above split key-value e(ntry) 
        b = e[1].indexOf("[");
        v = d(e[2]);

        //# As long as this is NOT a hash[]-style key-value e(ntry)
        if (b < 0) { //# b == "-1"
            //# d(ecode) the simple k(ey)
            k = d(e[1]);

            //# If the k(ey) already exists
            if (r[k]) {
                //# ma(make array) out of the k(ey) then .push the v(alue) into the k(ey)'s array in the r(eturn value)
                r[k] = ma(r[k]);
                Array.prototype.push.call(r[k], v);
            }
            //# Else this is a new k(ey), so just add the k(ey)/v(alue) into the r(eturn value)
            else {
                r[k] = v;
            }
        }
        //# Else we've got ourselves a hash[]-style key-value e(ntry) 
        else {
            //# Collect the d(ecoded) k(ey) and the d(ecoded) sk(sub-key) based on the b(racket) locations
            k = d(e[1].slice(0, b));
            sk = d(e[1].slice(b + 1, e[1].indexOf("]", b)));

            //# ma(make array) out of the k(ey) 
            r[k] = ma(r[k]);

            //# If we have a sk(sub-key), plug the v(alue) into it
            if (sk) { r[k][sk] = v; }
            //# Else .push the v(alue) into the k(ey)'s array
            else { Array.prototype.push.call(r[k], v); }
        }
    }

    //# Return the r(eturn value)
    return r;
};

为了获取查询字符串值,可以使用此“ GetParameterValues”函数。在这种情况下,您只需要传递查询搅拌参数名称,它将返回值$(document).ready(function(){var bid = GetParameterValues('token');}); 函数GetParameterValues(param){var url = encodeURIComponent(window.location.href); url = url.slice(url.indexOf('?')+1).split('&'); for(var i = 0; i <url.length; i ++){var urlparam = url [i] .split('='); if(urlparam [0] == param){返回urlparam [1]; }
麦克·克拉克

1
我已经使用了一段时间了,到目前为止效果很好。除了处理urlencoded数组。使用q = decodeURIComponent(window.location.search.substring(1)),帮助也可以做到这一点。
弗拉迪斯拉夫·迪米特洛夫

31

这是我不久前创建的函数,对此我感到非常满意。它不区分大小写-很方便。另外,如果所请求的QS不存在,则仅返回一个空字符串。

我使用了压缩版本。我将发布未压缩的新手类型,以更好地解释发生了什么。

我敢肯定,可以对其进行优化或以其他方式处理以更快地工作,但是对于我所需要的东西,它总是很有效的。

请享用。

function getQSP(sName, sURL) {
    var theItmToRtn = "";
    var theSrchStrg = location.search;
    if (sURL) theSrchStrg = sURL;
    var sOrig = theSrchStrg;
    theSrchStrg = theSrchStrg.toUpperCase();
    sName = sName.toUpperCase();
    theSrchStrg = theSrchStrg.replace("?", "&") theSrchStrg = theSrchStrg + "&";
    var theSrchToken = "&" + sName + "=";
    if (theSrchStrg.indexOf(theSrchToken) != -1) {
        var theSrchTokenLth = theSrchToken.length;
        var theSrchTokenLocStart = theSrchStrg.indexOf(theSrchToken) + theSrchTokenLth;
        var theLocOfNextAndSign = theSrchStrg.indexOf("&", theSrchTokenLocStart);
        theItmToRtn = unescape(sOrig.substring(theSrchTokenLocStart, theLocOfNextAndSign));
    }
    return unescape(theItmToRtn);
}

另外,最好还是使用encodeURI()或decodeURIComponent()而不是unescape()。 developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
阿达什讷Konchady

27

我们刚刚发布了arg.js,该项目旨在解决此问题。传统上这是如此困难,但是现在您可以:

var name = Arg.get("name");

或得到全部:

var params = Arg.all();

如果您关心之间的差异?query=true#hash=true则可以使用Arg.query()Arg.hash()方法。


你救了我的男人.. arg.js的解决方案没有解决方案正从#值在IE 8 .. :(从请求IE8#得到任何一个搜索这是解决方案..
迪利普·拉库玛

27

该问题的最高答案的问题是,它不支持在#后面放置参数,但有时也需要获取该值。

我修改了答案,使其也可以使用哈希符号解析完整的查询字符串:

var getQueryStringData = function(name) {
    var result = null;
    var regexS = "[\\?&#]" + name + "=([^&#]*)";
    var regex = new RegExp(regexS);
    var results = regex.exec('?' + window.location.href.split('?')[1]);
    if (results != null) {
        result = decodeURIComponent(results[1].replace(/\+/g, " "));
    }
    return result;
};

1
如果您需要它,这很有趣,但是哈希部分AFAIK的格式没有标准,因此将其称为其他答案的弱点是不公平的。
Rup

2
是的我知道。但是在我的应用程序中,我集成了第三方js导航,该导航在井号后具有一些参数。
Ph0en1x

例如,在Google搜索页面中,搜索查询后跟井号“#”。
etlds 2014年

25
function GetQueryStringParams(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');

    for (var i = 0; i < sURLVariables.length; i++)
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam)
        {
            return sParameterName[1];
        }
    }
}​

假设网址为

http://dummy.com/?stringtext=jquery&stringword=jquerybyexample

var tech = GetQueryStringParams('stringtext');
var blog = GetQueryStringParams('stringword');

这里已经有一些这种方法的实现。至少您需要对结果值进行解码UriComponent()。如果您未指定值(例如),则这也可能会导致行为异常?stringtext&stringword=foo
Rup

24

如果您使用的是Browserify,则可以使用Node.js中url模块:

var url = require('url');

url.parse('http://example.com/?bob=123', true).query;

// returns { "bob": "123" }

进一步阅读:URL Node.js v0.12.2手册和文档

编辑:您可以使用URL界面,它几乎在所有新浏览器中被广泛采用,如果代码要在旧的浏览器上运行,则可以使用这种polyfill。这是一个有关如何使用URL界面获取查询参数(又称为搜索参数)的代码示例

const url = new URL('http://example.com/?bob=123');
url.searchParams.get('bob'); 

您也可以为其使用URLSearchParams,这是MDN一个示例,可以使用URLSearchParams进行此操作:

var paramsString = "q=URLUtils.searchParams&topic=api";
var searchParams = new URLSearchParams(paramsString);

//Iterate the search parameters.
for (let p of searchParams) {
  console.log(p);
}

searchParams.has("topic") === true; // true
searchParams.get("topic") === "api"; // true
searchParams.getAll("topic"); // ["api"]
searchParams.get("foo") === null; // true
searchParams.append("topic", "webdev");
searchParams.toString(); // "q=URLUtils.searchParams&topic=api&topic=webdev"
searchParams.set("topic", "More webdev");
searchParams.toString(); // "q=URLUtils.searchParams&topic=More+webdev"
searchParams.delete("topic");
searchParams.toString(); // "q=URLUtils.searchParams"

url模块的API 文档位于:nodejs.org/api/url.html
andrezsanchez 2014年

这对nw.js开发非常有用。甚至不需要Browserify,因为大多数节点模块都可以像在nw.js窗口中那样工作。我已经测试了此代码,并且无需任何修改即可像魅力一样工作。
安德鲁·格罗斯

棒极了!URLSearchParams工作完美。非常感谢!
Baran Emre

1
应该可能是投票最好的,而没有自定义功能和其他库的麻烦。它似乎也被大多数浏览器2019采用
。– TheWhiteLlama
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.