js如何准确获取当前页面url网址信息

简介:

这篇文章主要为大家介绍了js准确获取当前页面url网址信息的多种方法,包括正则法、split拆分法等,需要的朋友可以参考下

在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中的参数值

一、正则法

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
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拆分法

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
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();<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的值,可以通过以下函数调用。

?
1
2
3
4
5
6
7
8
9
10
11
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( "j" ));

四、单个参数的获取方法

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

以上就是本文的全部内容,希望对大家理解如何获取当前页面url网址信息有所帮助。


转载自:http://www.jb51.net/article/82519.htm

相关文章
|
2月前
|
JavaScript 前端开发 程序员
前端原生Js批量修改页面元素属性的2个方法
原生 Js 的 getElementsByClassName 和 querySelectorAll 都能获取批量的页面元素,但是它们之间有些细微的差别,稍不注意,就很容易弄错!
|
3月前
|
机器学习/深度学习 自然语言处理 JavaScript
信息论、机器学习的核心概念:熵、KL散度、JS散度和Renyi散度的深度解析及应用
在信息论、机器学习和统计学领域中,KL散度(Kullback-Leibler散度)是量化概率分布差异的关键概念。本文深入探讨了KL散度及其相关概念,包括Jensen-Shannon散度和Renyi散度。KL散度用于衡量两个概率分布之间的差异,而Jensen-Shannon散度则提供了一种对称的度量方式。Renyi散度通过可调参数α,提供了更灵活的散度度量。这些概念不仅在理论研究中至关重要,在实际应用中也广泛用于数据压缩、变分自编码器、强化学习等领域。通过分析电子商务中的数据漂移实例,展示了这些散度指标在捕捉数据分布变化方面的独特优势,为企业提供了数据驱动的决策支持。
208 2
信息论、机器学习的核心概念:熵、KL散度、JS散度和Renyi散度的深度解析及应用
|
2月前
|
存储 缓存 网络协议
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点,GET、POST的区别,Cookie与Session
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点、状态码、报文格式,GET、POST的区别,DNS的解析过程、数字证书、Cookie与Session,对称加密和非对称加密
|
2月前
|
域名解析 缓存 网络协议
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
|
2月前
|
JavaScript 前端开发 索引
JavaScript获取url网址中域名后面的部分
如何截取 url 中网站域名之后的部分,需要用到以下几个方法:
95 3
|
3月前
|
存储 开发框架 JavaScript
Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
100 0
Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
|
3月前
|
Web App开发 前端开发 JavaScript
JavaScript动态渲染页面爬取——Selenium的使用(一)
JavaScript动态渲染页面爬取——Selenium的使用(一)
86 4
|
3月前
|
Web App开发 数据采集 JavaScript
JavaScript动态渲染页面爬取——Selenium的使用(二)
JavaScript动态渲染页面爬取——Selenium的使用(二)
116 2
|
3月前
|
JavaScript 前端开发 UED
JavaScript 地址信息与页面跳转
JavaScript 地址信息与页面跳转
79 1
|
3月前
|
前端开发 JavaScript Go
JS基础:输出信息的5种方式详解
JS基础:输出信息的5种方式详解
54 1