我有一个带有一些GET参数的URL,如下所示:

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

我需要得到c的全部值。我试图读取URL,但只得到m2。如何使用JavaScript执行此操作?


当前回答

我开发了一个JavaScript工具,只需一个简单的步骤

首先,将此脚本链接复制到HTML的头部:

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

然后简单地使用urlParams.c或urlParams['c']获取c的值。易于理解的

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

还要记住,我确实开发了这个,但这是一个轻松轻松的解决方案。该工具还包括十六进制字符解码,这通常很有用。

其他回答

获取单个参数值:

function getQueryParameter(query, parameter) {
return (window.location.href.split(parameter + '=')[1].split('&')[0]);}

这里是一个递归解决方案,它没有正则表达式,并且具有最小的变异(只有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中查找参数值时,这个尝试过的真正的正则表达式函数对我很有用,希望这有帮助:

var text='www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5'函数QueryString(项,文本){var foundString=text.match(新RegExp(“[\?\&]”+item+“=([^\&]*)(\&?)”,“i”));返回foundString?foundString[1]:foundString;}console.log(QueryString('c',文本));

使用类似QueuryString('param_name',url),并将返回值

平方米-3米-4米

还有一个建议。

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

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

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

编辑:在我写了这篇文章后,我注意到埃里克·埃利奥特的回答几乎相同,尽管它使用了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”。

这是我的解决方案。正如Andy E在回答这个问题时所建议的那样,如果只是为了获得一个值而重复构建各种正则表达式字符串、运行循环等,对脚本的性能没有好处。因此,我提出了一个更简单的脚本,它在一个对象中返回所有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".