快捷導(dǎo)航

JavaScript實(shí)現(xiàn)獲取URL中參數(shù)值的4種方法

更新時(shí)間：2025年02月07日 10:53:35 作者：Java全棧布道師

這篇文章主要為大家詳細(xì)介紹了如何使用JavaScript實(shí)現(xiàn)獲取URL中參數(shù)值的4種方法,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以了解一下

在前端開(kāi)發(fā)中，處理URL參數(shù)是一個(gè)常見(jiàn)的任務(wù)，尤其是在沒(méi)有框架支持的情況下。這篇文章為大家整理了JavaScript獲取URL中參數(shù)值的4種方法，希望對(duì)大家有所幫助

方法一：正則法

function getQueryString(name) {
    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return unescape(r[2]);
    }
    return null;
}
// 這樣調(diào)用：
alert(GetQueryString("參數(shù)名1"));
alert(GetQueryString("參數(shù)名2"));
alert(GetQueryString("參數(shù)名3"));

方法二：split拆分法

function GetRequest() {
    var url = location.search; //獲取url中"?"符后的字串
    var theRequest = new Object();
    if (url.indexOf("?") != -1) {
        var str = url.substr(1);
        strs = str.split("&");
        for(var i = 0; i < strs.length; i ++) {
            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
        }
    }
    return theRequest;
}
var Request = new Object();
Request = GetRequest();
// var 參數(shù)1,參數(shù)2,參數(shù)3,參數(shù)N;
// 參數(shù)1 = Request['參數(shù)1'];
// 參數(shù)2 = Request['參數(shù)2'];
// 參數(shù)3 = Request['參數(shù)3'];
// 參數(shù)N = Request['參數(shù)N'];

方法三：正則（推薦使用）

通過(guò)JS獲取url參數(shù)，這個(gè)經(jīng)常用到。比如說(shuō)一個(gè)url：http://wwww.fzitv.net/?q=js,我們想得到參數(shù)q的值，那可以通過(guò)以下函數(shù)調(diào)用即可。

function GetQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg); //獲取url中"?"符后的字符串并正則匹配
    var context = "";
    if (r != null)
        context = decodeURIComponent(r[2]);
    reg = null;
    r = null;
    return context == null || context == "" || context == "undefined" ? "" : context;
}
alert(GetQueryString("q"));

方法四：?jiǎn)蝹€(gè)參數(shù)的獲取方法

function GetRequest() {
   var url = location.search; //獲取url中"?"符后的字串
   if (url.indexOf("?") != -1) {    //判斷是否有參數(shù)
      var str = url.substr(1); //從第一個(gè)字符開(kāi)始 因?yàn)榈?個(gè)是?號(hào) 獲取所有除問(wèn)號(hào)的所有符串
      strs = str.split("=");   //用等號(hào)進(jìn)行分隔 （因?yàn)橹乐挥幸粋€(gè)參數(shù) 所以直接用等號(hào)進(jìn)分隔 如果有多個(gè)參數(shù) 要用&號(hào)分隔 再用等號(hào)進(jìn)行分隔）
      alert(strs[1]);          //直接彈出第一個(gè)參數(shù) （如果有多個(gè)參數(shù) 還要進(jìn)行循環(huán)的）
   }
}

到此這篇關(guān)于JavaScript實(shí)現(xiàn)獲取URL中參數(shù)值的4種方法的文章就介紹到這了,更多相關(guān)JavaScript獲取URL參數(shù)值內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: