一. URLSearchParams（需要高版本浏览器支持）
function getQueryString(name) {
const search = location.search();
const res = new URLSearchParams(search);
return res.get(name);
}
二.正则表达式（超级推荐）
若地址栏地址为：www.toutiao.html?info="zhoubotong"&age="156"
// 参数name为地址栏中的参数名
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
//方法调用如下
var myInfo = getQueryString("info");
if (myInfo != null && myInfo.toString().length > 1) {
console.log(getQueryString("info")); //zhoubotong
}
- 若地址栏没有携带参数，运行getQueryString()会报错
- 添加判断来增强代码的健壮性
三. 原生分割法
function getQueryString(name) {
var url = decodeURI(location.search); //解码地址栏中的数据 恢复中文数据
var object = {};
if (url.indexOf("?") != -1) {
var str = url.substr(1); //获取?后面的字符串
var strs = str.split("&"); //将参数按 & 分割成数组
for (var i = 0; i < strs.length; i++) {
object[strs[i].split("=")[0]] = strs[i].split("=")[1]
}
}
return object[name];
}
console.log(getQueryString("info"))//zhoubotong
-
location.search获取整个地址栏url -
decodeURI解码地址栏中的数据 恢复中文 -
split按&=将字符串分割成字符串数组
