js如何獲取url所傳遞的引數和引數值

大家知道可以使用url傳遞引數值，本站幾乎隨便一個連結都會有傳值，既然要傳遞值，那麼自然要獲取，否則就沒有任何意義了，下面就通過例項介紹一下如何使用javascript獲取url傳遞的引數和引數值。

程式碼例項如下:

[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]); 
  } 
})();

以上程式碼可以輸出url的引數和對應的引數值，下面就介紹一下實現過程。

一.實現原理:

1.判斷url是否含有引數。在本程式碼中使用正規表示式if(/\?/.test(url))判斷url中是否含有?，如果含有問號，那麼就說明此連結中含有引數，然後執行if語句中的程式碼。

2.獲取url中的引數和引數值。在這裡是使用split()函式分割字串，依次實現此功能。

二.程式碼註釋:

1.(function(){})()，宣告一個匿名函式並執行。

2.var urlToObject=function(url){}，宣告一個函式，此函式的引數是一個超連結。

3.var urlObject={}，宣告一個物件直接量。

4.if(/\?/.test(url)) ，判斷連結中是否含有?，也就是是否含有引數。

5.var urlString=url.substring(url.indexOf("?")+1)，擷取url問號只有的字串。

6.var urlArray=urlString.split("&")，使用split()函式以&為標記分割字串，並生成一個陣列。這樣每一個陣列元素就是一個引數和引數值對。

7.for(var i=0,len=urlArray.length;i<len;i++)，使用for迴圈遍歷urlArray陣列。

8.var urlItem=urlArray，將指定索引的陣列值賦值給變數urlItem。

9.var item=urlItem.split("=")，再使用=分割字串並生成一個陣列，因為urlArray陣列每一個元素都是一個引數和引數值對，例如"a=0",這樣再經過分割，生成新陣列的第一項就是引數名稱，第二個項就是引數值。

10.urlObject[item[0]]=item[1]，將引數名稱作為物件的屬性名稱，引數值作為物件的屬性值。

11.return urlObject，返回物件。

12.var testUrl=http://softwhy.com/index.php?a=0&b=1&c=2，用作測試的url。

13.var result=urlToObject(testUrl)，將引數和引數值轉換成物件的屬性和屬性值，並返回此物件。

14.for(var key in result)，遍歷此物件.

三.相關閱讀:

1.substring()函式可以參閱javascript substring()一章節。 

2.indexOf()函式可以參閱JavaScript String indexOf()一章節。

3.split()函式可以參閱JavaScript split()一章節。 

4.for in語句可以參閱javascript for in一章節。