js如何準確取得目前頁面url網址資訊_javascript技巧-js教程-PHP中文網

js如何準確取得目前頁面url網址資訊_javascript技巧

WBOY

發布： 2016-05-16 15:05:06

原創

2128 人瀏覽過

在WEB開發中，時常會用到javascript來獲取當前頁面的url網址信息，在這裡是我的一些獲取url信息的小總結。

下面我們舉例一個URL，然後得到它的各個組成部分：http://i.cnblogs.com/EditPosts.aspx?opt=1

1、window.location.href(設定或取得整個 URL 為字串)

var test = window.location.href;
alert(test);
回：http://i.cnblogs.com/EditPosts.aspx?opt=1

2、window.location.protocol(設定或取得 URL 的協定部分)

var test = window.location.protocol;
alert(test);
回傳：http:

3、window.location.host(設定或取得 URL 的主機部分)

var test = window.location.host;
alert(test);
回：i.cnblogs.com

4、window.location.port(設定或取得與 URL 關聯的連接埠號碼)

var test = window.location.port;
alert(test);
傳回：空字元(如果採用預設的80埠(update:即使新增了:80)，那麼回傳值並不是預設的80而是空字元)

5、window.location.pathname(設定或取得與 URL 的路徑部分（就是檔案位址）)
var test = window.location.pathname;
alert(test);
回傳：/EditPosts.aspx

6、window.location.search(設定或取得 href 屬性中跟在問號後面的部分)

var test = window.location.search;
alert(test);
回傳：?opt=1

PS：獲得查詢（參數）部分，除了給動態語言賦值以外，我們同樣可以給靜態頁面，並使用javascript來獲得相信應的參數值。

7、window.location.hash(設定或取得 href 屬性中在井號「#」後面的分段)

var test = window.location.hash;
alert(test);
回傳：空字元(因為url中沒有)

8、js取得url中的參數值

一、正規法

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中"&#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]] = unescape(strs[i].split("=")[1]);
    }
  }
  return theRequest;
}
var Request = new Object();
Request = GetRequest();<br>// var id=Request["id"]; 
// var 参数1,参数2,参数3,参数N;
// 参数1 = Request['参数1'];
// 参数2 = Request['参数2'];
// 参数3 = Request['参数3'];
// 参数N = Request['参数N'];

登入後複製

三、指定取

比如說一個url：http://i.cnblogs.com/?j=js,我們想得到參數j的值，可以用以下函數呼叫。

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

登入後複製

四、單一參數的取得方法

function GetRequest() {
  var url = location.search; //获取url中"&#63;"符后的字串
  if (url.indexOf("&#63;") != -1) {  //判断是否有参数
   var str = url.substr(1); //从第一个字符开始 因为第0个是&#63;号 获取所有除问号的所有符串
   strs = str.split("=");  //用等号进行分隔 （因为知道只有一个参数 所以直接用等号进分隔 如果有多个参数 要用&号分隔 再用等号进行分隔）
   alert(strs[1]);     //直接弹出第一个参数 （如果有多个参数 还要进行循环的）
  }
}

登入後複製

以上就是本文的全部內容，希望對大家理解如何取得目前頁面url網址資訊有所幫助。