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

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

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


当前回答

还有一个建议。

已经有一些很好的答案,但我发现它们不必要地复杂,难以理解。这是一个简短、简单的数组,它返回一个简单的关联数组,其中键名与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”。

其他回答

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

您可以创建一个对象(或使用Location对象)并添加一个方法,该方法允许您获取URL参数,解码后使用JS样式:

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中获取对象,下次它将加载保存的对象。

实例

在url中,如?param1=param1Value&param2=param2Value&param1=param1Value2,参数的获取方式如下:

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

我见过的大多数实现都错过了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);

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

从urlStr字符串:

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

或从当前URL:

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

说明:

document.URL-接口以字符串形式返回文档位置(页面URL)。replace()-方法返回一个新字符串,其中模式的部分或全部匹配项由替换项替换。/.*param_name=([^&]*).*/-括在斜杠之间的正则表达式模式,表示:.*-零个或多个字符,param_name=-已搜索的param名称,正则表达式中的()-组,[^&]*-一个或多个字符,不包括&,|-交替,$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}');

我尽可能喜欢速记:

网址:example.com/mortgage_calc.htm?pmts=120&intr=6.8&prin=10000

香草Javascript:

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"}
function getParamValue(param) {
    var urlParamString = location.search.split(param + "=");
    if (urlParamString.length <= 1) return "";
    else {
        var tmp = urlParamString[1].split("&");
        return tmp[0];
    }
}

无论参数是否为最后一个,这都适用于您的情况。