JavaScript 修改 URL 地址栏参数的实现方法

作者:拾光

时间:2026-10-30

浏览:331

本文介绍了使用 JavaScript 动态修改浏览器地址栏参数的两种主要方式:通过 window.location.href 直接跳转和通过 window.location.hash 实现无刷新状态更新。文章提供了具体的代码示例,展示了如何编写函数来替换或追加 URL 中的查询参数,并解释了利用 Hash 值实现 AJAX 无刷新页面状态管理的原理与优势。

文章目录

JavaScript 修改 URL 地址栏参数的实现方法

直接展示核心代码与实现方案。

关键实现代码如下:


function changeURLPar(destiny, par, par_value)
{
var pattern = par+'=([^&]*)';
var replaceText = par+'='+par_value;
if (destiny.match(pattern))
{
var tmp = '/\\'+par+'=[^&]*/';
tmp = destiny.replace(eval_r(tmp), replaceText);
return (tmp);
}
else
{
if (destiny.match('[\?]'))
{
return destiny+'&'+ replaceText;
}
else
{
return destiny+'?1=1&'+replaceText;
}
}
return destiny+'\n'+par+'\n'+par_value;
}

利用 JavaScript 动态修改地址栏内容,主要涉及 window.location.href 和 window.location.hash 两个属性。

通过修改 window.location.hash 可以改变地址栏显示的内容,且不会像修改 window.location.href 那样触发页面提交或刷新。

修改 Hash 值后,地址栏末尾会追加 # 及后续内容。这种方式可用于解决 AJAX 无刷新状态下页面位置的记录问题,也能实现某些无需刷新的界面特效,应用价值较高。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章