首頁 > web前端 > js教程 > JS根據key值取得URL中的參數值及把URL的參數轉換成json物件_javascript技巧

JS根據key值取得URL中的參數值及把URL的參數轉換成json物件_javascript技巧

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
發布: 2016-05-16 15:42:39
原創
1514 人瀏覽過

不廢話了,直接貼程式碼了,透過範例一講解JS根據key值取得URL中的參數值及把URL的參數轉換成json對象,範例二講解js取得url傳遞參數,具體內容請看下文

範例一:

//把url的參數部分轉換成json物件 

1

2

3

4

5

6

7

8

9

10

11

12

13

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中的參數值

1

2

3

4

5

6

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傳遞參數:

js取得url傳遞參數方法一:

 這裡是取得URL帶QUESTRING參數的JAVASCRIPT客戶解決方案,相當於asp的request.querystring,PHP的$_GET
函數:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<Script language="javascript">

function GetRequest() {

  

 var url = location.search; //获取url中"&#63;"符后的字串

 var theRequest = new Object();

 if (url.indexOf("&#63;") != -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>

登入後複製

然後我們透過呼叫此函數來取得對應參數值:

1

2

3

4

5

6

7

8

9

<Script language="javascript">

var Request = new Object();

Request = GetRequest();

var 参数1,参数2,参数3,参数N;

参数1 = Request[''参数1''];

参数2 = Request[''参数2''];

参数3 = Request[''参数3''];

参数N = Request[''参数N''];

</Script>

登入後複製

以此取得url字串中所帶的同名參數

js取得url傳遞參數方法二 正規分析法:

1

2

3

4

5

6

7

8

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("参数名1"));

alert(GetQueryString("参数名2"));

alert(GetQueryString("参数名3"));

登入後複製

其他參數取得介紹:

//設定或取得物件指定的檔案名稱或路徑。

1

alert(window.location.pathname);

登入後複製

//設定或取得整個 URL 為字串。

1

alert(window.location.href);

登入後複製

//設定或取得與 URL 關聯的連接埠號碼。

1

alert(window.location.port);

登入後複製

//設定或取得 URL 的協定部分。

1

alert(window.location.protocol);

登入後複製

//設定或取得 href 屬性中井號「#」後面的分段。

1

alert(window.location.hash);

登入後複製

//設定或取得 location 或 URL 的 hostname 和 port 號碼。

1

alert(window.location.host);

登入後複製

//設定或取得 href 屬性跟在問號後面的部分。

1

alert(window.location.search);

登入後複製

以上內容介紹了JS根據key值取得URL中的參數值及把URL的參數轉換成json對象,js透過兩種方式取得url傳遞參數,程式碼

非常簡單,希望對大家有幫助。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板