有学有练才叫学习:学而不思则罔,思而不学则殆:学而不习,纸上谈兵,习而不进,画地为牢!

JavaScript-如何使用js获取当前网页的URL?(解决中文乱码)

javascript 炮渣日记 1个月前 (11-06) 36次浏览 已收录 0个评论 扫描二维码

相信做页面之间的跳转,很多时候大家都会需要页面1跳转到页面2带参数和参数值,方面再页面2进行相关操作,那么下面简单为大家介绍两种方式。

URL 信息

JavaScript 提供了许多方法来检索和更改显示在浏览器地址栏中的当前 URL,所有这些方法都使用Location对象,它是对象的一个​属性Window。

您可以创建一个具有当前URL的新对象,如下所示:

let loc = window.location;
let url = loc.href;

Location 属性

Location 接口不继承任何属性,但是实现了那些来自 URLUtils 的属性。

Location.href包含整个URL的一个DOMStringLocation.protocol包含URL对应协议的一个DOMString,最后有一个”:”。

Location.host包含了域名的一个DOMString,可能在该串最后带有一个”:”并跟上URL的端口号。

Location.hostname包含URL域名的一个DOMString。

Location.port包含端口号的一个DOMString。

Location.pathname包含URL中路径部分的一个DOMString,开头有一个“/”。Location.search 包含URL参数的一个DOMString,开头有一个“?”。

Location.hash包含块标识符的DOMString,开头有一个“#”。

Location.username包含URL中域名前的用户名的一个DOMString。

Location.password包含URL域名前的密码的一个 DOMString。

Location.origin只读包含页面来源的域名的标准形式DOMString。

方法

Location没有继承任何方法,但实现了来自URLUtils的方法。

Location.assign()加载给定URL的内容资源到这个Location对象所关联的对象上。

Location.reload()重新加载来自当前 URL的资源。他有一个特殊的可选参数,类型为 Boolean,该参数为true时会导致该方法引发的刷新一定会从服务器上加载数据。如果是 false或没有制定这个参数,浏览器可能从缓存当中加载页面。

Location.replace()用给定的URL替换掉当前的资源。与 assign() 方法不同的是用 replace()替换的新页面不会被保存在会话的历史 History中,这意味着用户将不能用后退按钮转到该页面。

Location.toString()返回一个DOMString,包含整个URL。 它和读取URLUtils.href的效果相同。但是用它是不能够修改Location的值的。

方法一:window.location 对象所包含的属性,然后通过 split 方法结合循环遍历自由组织数据格式。

window.location 对象所包含的属性

属性

描述

hash

从井号 (#) 开始的 URL(锚)

host

主机名和当前 URL 的端口号

hostname

当前 URL 的主机名

href

完整的 URL

pathname

当前 URL 的路径部分

port

当前 URL 的端口号

protocol

当前 URL 的协议

search

从问号 (?) 开始的 URL(查询部分)

//无中文获取
function getQueryVariable(variable){
       var query = window.location.search.substring(1);
       var vars = query.split("&");
       for (var i=0;i<vars.length;i++) {
               var pair = vars[i].split("=");
               if(pair[0] == variable){return pair[1];}
       }
       return(false);
}

上面方法无中文情况下,效果满足。有中文参数值,则会乱码,需要解码。那么如果参数值有中文的情况下,可以使用方法二。

方法二:使用正则表达式。

//中文乱码问题解决
function getQueryString(name) { 
  //匹配以 &name=开头 或者 name=开头 中间为任意多个除了 & 以外的字符 一旦遇到 & 或者 空白 就中止取值
	  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); 
	  var r = window.location.search.substr(1).match(reg); 
	  if (r != null) return decodeURI(r[2]); return null; 
}

注意 : 创建一个RegExp对象: new RegExp(pattern,attributes);

如果使用new关键字 则会创建一个RegExp对象,如果不使用new关键字则不会创建RegExp对象(直接当做一个正则字符串使用)。ECMAScript 标准化之前,不支持 m 属性。如果 pattern 是正则表达式,而不是字符串,则必须省略该参数。

喜欢 (0)
炮渣日记
关于作者:
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址