JS獲取URL中參數值(QueryString)的4種方法

2017-06-01 1148 1 編輯:深圳網站建設 來源:互聯網

JS獲取URL中參數值(QueryString)的4種方法

方法一:正則法

復制代碼 代碼如下: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;

}

// 這樣調用:

alert(GetQueryString("參數名1"));

alert(GetQueryString("參數名2"));

alert(GetQueryString("參數名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 參數1,參數2,參數3,參數N;

// 參數1 = Request['參數1'];

// 參數2 = Request['參數2'];

// 參數3 = Request['參數3'];

// 參數N = Request['參數N'];

方法三:又見正則

通過JS獲取url參數,這個經常用到。比如說一個url:http://wwww.jb51.net/?q=js,我們想得到參數q的值,那可以通過以下函數調用即可。

復制代碼 代碼如下:

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 = r[2];  

    reg = null;  

    r = null;  

    return context == null || context == "" || context == "undefined" ? "" : context;  

}

alert(GetQueryString("q")); 

方法四:單個參數的獲取方法

function GetRequest() {

   var url = location.search; //獲取url中"?"符后的字串

   if (url.indexOf("?") != -1) {    //判斷是否有參數

      var str = url.substr(1); //從第一個字符開始 因為第0個是?號 獲取所有除問號的所有符串

      strs = str.split("=");   //用等號進行分隔 (因為知道只有一個參數 所以直接用等號進分隔 如果有多個參數 要用&號分隔 再用等號進行分隔)

      alert(strs[1]);          //直接彈出第一個參數 (如果有多個參數 還要進行循環的)

   }

}

專業的網站建設公司,深正互聯,如您有網站營銷需求,請您關注我們,或者致電13828884598


本站文章均為深正網站建設摘自權威資料,書籍,或網絡原創文章,如有版權糾紛或者違規問題,請即刻聯系我們刪除,我們歡迎您分享,引用和轉載,但謝絕直接搬磚和抄襲!感謝...
關注深正互聯
七星彩头尾