JavaScript 获取与设置 URL 查询参数的方法
作者:函数茶馆时间:2026-10-21 20:49:31浏览:458
本文介绍了使用 JavaScript 获取和设置浏览器 URL 查询参数的两种常用方法。通过解析 URL 字符串,提取指定参数值或动态修改参数,适用于需要处理前端路由或接口传参的场景。
JavaScript 获取与设置 URL 参数示例
具体实现示例如下:
function getQueStr(url, ref) //取获参数值
{
var str = url.substr(url.indexOf('?') + 1);
if (str.indexOf('&') != -1) {
var arr = str.split('&');
for (i in arr) {
if (arr[i].split('=')[0] == ref)
return arr[i].split('=')[1];
}
}
else {
return url.substr(url.indexOf('=') + 1)
}
}
function setQueStr(url, ref, value) //设置参数值
{
var str = "";
if (url.indexOf('?') != -1)
str = url.substr(url.indexOf('?') + 1);
else
return url + "?" + ref + "=" + value;
var returnurl = "";
var setparam = "";
var arr;
var modify = "0";
if (str.indexOf('&') != -1) {
arr = str.split('&');
for (i in arr) {
if (arr[i].split('=')[0] == ref) {
setparam = value;
modify = "1";
}
else {
setparam = arr[i].split('=')[1];
}
returnurl = returnurl + arr[i].split('=')[0] + "=" + setparam + "&";
}
returnurl = returnurl.substr(0, returnurl.length - 1);
if (modify == "0")
if (returnurl == str)
returnurl = returnurl + "&" + ref + "=" + value;
}
else {
if (str.indexOf('=') != -1) {
arr = str.split('=');
if (arr[0] == ref) {
setparam = value;
modify = "1";
}
else {
setparam = arr[1];
}
returnurl = arr[0] + "=" + setparam;
if (modify == "0")
if (returnurl == str)
returnurl = returnurl + "&" + ref + "=" + value;
}
else
returnurl = ref + "=" + value;
}
return url.substr(0, url.indexOf('?')) + "?" + returnurl;
}
function delQueStr(url, ref) //删除参数值
{
var str = "";
if (url.indexOf('?') != -1)
str = url.substr(url.indexOf('?') + 1);
else
return url;
var arr = "";
var returnurl = "";
var setparam = "";
if (str.indexOf('&') != -1) {
arr = str.split('&');
for (i in arr) {
if (arr[i].split('=')[0] != ref) {
returnurl = returnurl + arr[i].split('=')[0] + "=" + arr[i].split('=')[1] + "&";
}
}
return url.substr(0, url.indexOf('?')) + "?" + returnurl.substr(0, returnurl.length - 1);
}
else {
arr = str.split('=');
if (arr[0] == ref)
return url.substr(0, url.indexOf('?'));
else
return url;
}
}
上述关于 JavaScript 操作浏览器参数的方法即为本文分享的全部内容,希望能为读者提供有益参考,并欢迎大家继续支持本站。
作者最新文章
JS split切割后出现空字符串怎么过滤
2026-11-05 16:00:30
在 React 或 Vue 项目中封装使用 JS 节流防抖
2026-11-05 15:27:29
JavaScript中怎么将带小数的字符串转为整数?
2026-11-05 14:32:38
怎么用JavaScript策略模式重构电商促销计算逻辑?
2026-11-05 14:01:09
JS使用constructor判断数据类型可靠吗
2026-11-05 13:49:41
