本文介绍了JavaScript中解析URL查询参数的两种常用方法:正则表达式分析法用于获取特定参数值,对象解析法用于将整个URL参数字符串转换为键值对对象。通过具体代码示例展示了如何提取和处理URL中的查询参数,适用于前端开发中的常见需求。
JavaScript解析URL查询参数的两种常用方法
接下来直接展示相关代码实现。
var path = 'www.u.com/home?id=2&type=0&dtype=-1';
function parseUrl(url){
var result = [];
var query = url.split("?")[1];
var queryArr = query.split("&");
queryArr.forEach(function(item){
var obj = {};
var value = item.split("=")[0];
var key = item.split("=")[1];
obj[key] = value;
result.push(obj);
});
return result;
}
console.log(parseUrl(path));
//[{id: '2'},{type: '0'},{dtype: '-1'}]
下面介绍两种在JavaScript中获取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"));
方法二:参数对象化
第二种方法:将参数转换为对象。
具体代码实现如下:
<Script language="javascript">
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;
}
</Script>
调用方式示例:
<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>
以上即为JS解析URL查询参数的相关内容。