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

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


当前回答

使用纯JavaScript和正则表达式的简单解决方案:

alert(getQueryString("p2"));

function getQueryString (Param) {
    return decodeURI("http://www.example.com/?p1=p11&p2=p2222".replace(new RegExp("^(?:.*[&?]" + encodeURI(Param).replace(/[.+*]/g, "$&") + "(?:=([^&]*))?)?.*$", "i"), "$1"));
}

Js投标

其他回答

如果您使用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"

此函数将查询字符串转换为类似JSON的对象,它还处理无值和多值参数:

"use strict";
function getQuerystringData(name) {
    var data = { };
    var parameters = window.location.search.substring(1).split("&");
    for (var i = 0, j = parameters.length; i < j; i++) {
        var parameter = parameters[i].split("=");
        var parameterName = decodeURIComponent(parameter[0]);
        var parameterValue = typeof parameter[1] === "undefined" ? parameter[1] : decodeURIComponent(parameter[1]);
        var dataType = typeof data[parameterName];
        if (dataType === "undefined") {
            data[parameterName] = parameterValue;
        } else if (dataType === "array") {
            data[parameterName].push(parameterValue);
        } else {
            data[parameterName] = [data[parameterName]];
            data[parameterName].push(parameterValue);
        }
    }
    return typeof name === "string" ? data[name] : data;
}

我们对参数[1]执行未定义检查,因为如果变量未定义,decodeURIComponent将返回字符串“undefined”,这是错误的。

用法:

"use strict";
var data = getQuerystringData();
var parameterValue = getQuerystringData("parameterName");
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

只需使用两个拆分:

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

我读了之前所有的答案,也读了更完整的答案。但我认为这是最简单快捷的方法。您可以检查这个jsPerf基准

要解决Rup评论中的问题,请通过将第一行更改为下面的两行来添加条件拆分。但绝对的准确性意味着它现在比正则表达式慢(参见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编码字符(在值中包含这些字符是个坏主意)-您可以使用以下是第一个选项的略为简化和可读的版本:函数getQueryStringValueByName(名称){var queryStringFromStartOfValue=位置.search.split(名称+“=”)[1];返回queryStringFromStartOfValue!==未定义?queryStringFromStartOfValue.split(“&”)[0]:null;

snipplr.com上的Roshambo有一个简单的脚本来实现这一点,这在使用jQuery|Improved获取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.example/index.html?lang=de。

只需调用var langval=$.urlParam('lang');,你已经得到了。

UZBEKJON也在这方面发表了一篇很棒的博客文章,用jQuery获取URL参数和值。