JS获取当前页面的URL参数

1.首先需要获取当前页面的URL,这个可以从 window.location.search 获取:

//获取当前页面的完整地址
var currentUrl = window.location.href;
//获取当前页面URL的从问号 (?) 开始的 URL(查询部分)
var params = window.location.search;

 

Location 对象属性

属性描述
hash设置或返回从井号 (#) 开始的 URL(锚)。
host设置或返回主机名和当前 URL 的端口号。
hostname设置或返回当前 URL 的主机名。
href设置或返回完整的 URL。
pathname设置或返回当前 URL 的路径部分。
port设置或返回当前 URL 的端口号。
protocol设置或返回当前 URL 的协议。
search设置或返回从问号 (?) 开始的 URL(查询部分)。

上表来自 http://www.w3school.com.cn/jsref/dom_obj_location.asp 

2.获取具体的参数

以Google "JS获取当前页面url参数" 的URL为例:

https://www.google.com/search?ei=XEDqW-fuAoXN0PEPytmR-As&q=JS%E8%8E%B7%E5%8F%96%E5%BD%93%E5%89%8D%E9%A1%B5%E9%9D%A2url%E5%8F%82%E6%95%B0&oq=JS%E8%8E%B7%E5%8F%96%E5%BD%93%E5%89%8D%E9%A1%B5%E9%9D%A2url%E5%8F%82%E6%95%B0&gs_l=psy-ab.3...3192.3424.0.3909.3.3.0.0.0.0.280.280.2-1.1.0....0...1c.1j4.64.psy-ab..2.0.0....0.Bf-4Zsck6OI

以下内容转载自: https://blog.csdn.net/tjcyjd/article/details/44275531

但unescape函数替换为了decodeURLcomponent

有两种方法:

(1)split 分割放进对象:

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]]=decodeURLcomponent(strs[i].split("=")[1]); 
		} 
	} 
	return theRequest; 
} 
 
var req = GetRequest(); 
 
var query = req['q'];
 
alert(query);

(2)正则表达式匹配:

function getQueryString(name) {
	var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
	var r = window.location.search.substr(1).match(reg);
	if (r != null) return decodeURLcomponent(r[2]); return null;
}
 
var query= getQueryString("q");
 
alert(query);

注:

1.window.location.search中包含中文参数时,使用unescape进行解码会出现乱码错误,应该使用 decodeURLComponent函数;

关于 escape encodeURI encodeURIComponent 的区别,请参考:

https://www.cnblogs.com/qiantuwuliang/archive/2009/07/19/1526687.html

主要区别是:

1..escapte unescapte 已经被废弃;

2.encodeURI/decodeURI 用于编码/解码整个URL, encodeURIComponent/decodeURIComponent 用于编码/解码URL的部分参数;

  • 6
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值