news 2026/4/18 3:39:24

删除 地址栏 地址里的 某个的参数 无感刷新页面

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
删除 地址栏 地址里的 某个的参数 无感刷新页面
consturl=newURL(window.location.href);url.searchParams.delete('abc');window.history.replaceState(null,'',url.toString());意思就是 删除 地址栏 地址里的 abc的参数 www.666.com?abc=123删完之后 就是 www.666.com

这段代码的作用就是在不刷新页面的前提下,从浏览器地址栏中删除 URL 的某个查询参数(这里是abc


逐行解释:

consturl=newURL(window.location.href);
  • 创建一个URL对象,解析当前页面的完整 URL(比如https://www.666.com?abc=123&def=456)。
url.searchParams.delete('abc');
  • 调用URLSearchParams.delete('abc')方法,移除查询字符串中名为abc的参数
  • 无论abc有没有值(如?abc?abc=123),都会被彻底删除。
  • 其他参数(如def=456)不受影响。
window.history.replaceState(null,'',url.toString());
  • 使用history.replaceState()替换当前历史记录条目,将 URL 更新为删除abc后的新地址;
  • null表示不存储额外状态数据;
  • 第二个参数是标题(现代浏览器基本忽略);
  • 第三个参数是新的 URL(不含abc);
  • 关键:这不会触发页面跳转或刷新!

举个例子:

原始 URL:

https://www.666.com?abc=123&xyz=789

执行代码后,地址栏变成:

https://www.666.com?xyz=789

如果原始 URL 是:

https://www.666.com?abc=123

执行后就变成:

https://www.666.com

✅ 完全符合你的描述。


补充说明

  • 这种方式常用于:用户完成某个操作后(比如关闭弹窗、清除筛选条件),清理 URL 中的临时参数,保持地址干净。
  • 相比window.location.href = ...,它不会重新加载页面,用户体验更流畅。
  • 如果你希望保留历史记录(点返回能回到带参数的状态),可以用pushState而不是replaceState

封装成函数(推荐复用)

functionremoveUrlParam(paramName){consturl=newURL(window.location.href);url.searchParams.delete(paramName);window.history.replaceState(null,'',url.toString());}// 使用removeUrlParam('abc');

这样你就可以轻松删除任意参数了 ✅

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/17 18:12:27

破局Python代码保护:操作码映射重置的攻防博弈与未来防护演进

Python凭借简洁的语法、丰富的生态成为跨领域开发的主流语言,但因其解释型特性,字节码易被反编译、源码泄露风险高的问题始终困扰着开发者与企业。代码保护成为Python商业化、工程化落地的核心课题,而操作码(Opcode)映…

作者头像 李华
网站建设 2026/3/29 7:48:39

WEP-L水文模型率定拟合优但验证失效:成因解析与系统化解决策略

在WEP-L分布式水文模型的实际应用中,率定期实测与模拟流量高拟合、验证期拟合效果大幅衰减是典型的模型应用痛点,该问题本质反映了模型参数稳健性不足、输入输出数据匹配度低或模型结构与研究区水文过程适配性偏差,若未针对性解决&#xff0c…

作者头像 李华
网站建设 2026/4/15 17:03:03

STM32H743: 实现XPT2046触摸屏与LTDC联动

目录 一、XPT2046 触摸屏与 LTDC 联动实现 1. XPT2046 核心原理(与 LTDC 联动的基础) 2. 前置准备 (1)硬件连接(STM32H743 XPT2046 800x480 TFT-LCD) (2)软件环境 3. STM32C…

作者头像 李华
网站建设 2026/4/15 15:37:53

YOLOv10官方镜像训练500轮,收敛效果展示

YOLOv10官方镜像训练500轮,收敛效果展示 在目标检测模型的实际工程落地中,一个常被忽视却至关重要的问题浮出水面:训练过程是否稳定?收敛曲线是否健康?500轮训练后,模型性能是否真正达到平台期&#xff1f…

作者头像 李华
网站建设 2026/3/30 13:21:55

免费看直播APP下载,附m3u8直播源M3U直播源等下载

提供了一些可以免费看的软件 目前已经找到比较多的,部分是CSDN收费下载的,放在文章底部了,需要的大佬直接去拿吧。 有的是以前老的,就没下载,尽量下载一些新的,如果有不行的就换一个试试, 下载…

作者头像 李华