JS根據(jù)key值獲取URL中的參數(shù)值

本文提供了兩個實例，其中，示例一講解JS根據(jù)key值獲取URL中的參數(shù)值及把URL的參數(shù)轉(zhuǎn)換成json對象；示例二講解js獲取url傳遞參數(shù)，具體介紹內(nèi)容請看下文：

示例一：

//把url的參數(shù)部分轉(zhuǎn)化成json對象
parseQueryString: function (url) {
 var reg_url = /^[^\?]+\?([\w\W]+)$/,
  reg_para = /([^&=]+)=([\w\W]*?)(&|$|#)/g,
  arr_url = reg_url.exec(url),
  ret = {};
 if (arr_url && arr_url[1]) {
  var str_para = arr_url[1], result;
  while ((result = reg_para.exec(str_para)) != null) {
   ret[result[1]] = result[2];
  }
 }
 return ret;
}

// 通過key獲取url中的參數(shù)值
getQueryString: function (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;
}

示例二：

js通過兩種方法獲取url傳遞參數(shù)：

<Script language="javascript">
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]]=(strs[i].split("=")[1]);
  }
 }
 return theRequest;
}
</Script>

然后我們通過調(diào)用此函數(shù)獲取對應(yīng)參數(shù)值：

<Script language="javascript">
  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''];
</Script>

以此獲取url串中所帶的同名參數(shù)

js獲取url傳遞參數(shù)方法二 正則分析法：

function GetQueryString(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)","i");
  var r = window.location.search.substr(1).match(reg);
  if (r!=null) return (r[2]); return null;
}
alert(GetQueryString("參數(shù)名1"));
alert(GetQueryString("參數(shù)名2"));
alert(GetQueryString("參數(shù)名3"));

其他參數(shù)獲取介紹：
//設(shè)置或獲取對象指定的文件名或路徑。
?
alert(window.location.pathname);
//設(shè)置或獲取整個 URL 為字符串。
?
alert(window.location.href);
//設(shè)置或獲取與 URL 關(guān)聯(lián)的端口號碼。
?
alert(window.location.port);
//設(shè)置或獲取 URL 的協(xié)議部分。
?
alert(window.location.protocol);
//設(shè)置或獲取 href 屬性中在井號“#”后面的分段。
?
alert(window.location.hash);
//設(shè)置或獲取 location 或 URL 的 hostname 和 port 號碼。
?
alert(window.location.host);
//設(shè)置或獲取 href 屬性中跟在問號后面的部分。
?
alert(window.location.search);

js如何獲取url所傳遞的參數(shù)和參數(shù)值

大家知道可以使用url傳遞參數(shù)值，本站幾乎隨便一個鏈接都會有傳值，既然要傳遞值，那么自然要獲取，否則就沒有任何意義了，下面就通過實例介紹一下如何使用javascript獲取url傳遞的參數(shù)和參數(shù)值。

代碼實例如下:

[javascript]
(function(){   
  var urlToObject=function(url){   
    var urlObject = {};   
    if (/\?/.test(url)){   
      var urlString=url.substring(url.indexOf("?")+1);   
      var urlArray=urlString.split("&");   
      for(var i=0,len=urlArray.length;i<len;i++){   
        var urlItem=urlArray[i];   
        var item = urlItem.split("=");   
        urlObject[item[0]]=item[1];   
      }   
      return urlObject;   
    }   
  };   
  var testUrl="http://softwhy.com/index.php?a=0&b=1&c=2";   
  var result=urlToObject(testUrl);   
  for (var key in result){   
    console.log(key+"="+result[key]);   
  }   
})(); 

一.實現(xiàn)原理:
1.判斷url是否含有參數(shù)。在本代碼中使用正則表達式if(/\?/.test(url))判斷url中是否含有?，如果含有問號，那么就說明此鏈接中含有參數(shù)，然后執(zhí)行if語句中的代碼。
2.獲取url中的參數(shù)和參數(shù)值。在這里是使用split()函數(shù)分割字符串，依次實現(xiàn)此功能。

二.代碼注釋:
1.(function(){})()，聲明一個匿名函數(shù)并執(zhí)行。
2.var urlToObject=function(url){}，聲明一個函數(shù)，此函數(shù)的參數(shù)是一個超鏈接。
3.var urlObject={}，聲明一個對象直接量。
4.if(/\?/.test(url)) ，判斷鏈接中是否含有?，也就是是否含有參數(shù)。
5.var urlString=url.substring(url.indexOf("?")+1)，截取url問號只有的字符串。
6.var urlArray=urlString.split("&")，使用split()函數(shù)以&為標記分割字符串，并生成一個數(shù)組。這樣每一個數(shù)組元素就是一個參數(shù)和參數(shù)值對。
7.for(var i=0,len=urlArray.length;i<len;i++)，使用for循環(huán)遍歷urlArray數(shù)組。
8.var urlItem=urlArray，將指定索引的數(shù)組值賦值給變量urlItem。
9.var item=urlItem.split("=")，再使用=分割字符串并生成一個數(shù)組，因為urlArray數(shù)組每一個元素都是一個參數(shù)和參數(shù)值對，例如"a=0",這樣再經(jīng)過分割，生成新數(shù)組的第一項就是參數(shù)名稱，第二個項就是參數(shù)值。
10.urlObject[item[0]]=item[1]，將參數(shù)名稱作為對象的屬性名稱，參數(shù)值作為對象的屬性值。
11.return urlObject，返回對象。
12.var testUrl=http://softwhy.com/index.php?a=0&b=1&c=2，用作測試的url。
13.var result=urlToObject(testUrl)，將參數(shù)和參數(shù)值轉(zhuǎn)換成對象的屬性和屬性值，并返回此對象。
14.for(var key in result)，遍歷此對象.