javascript history api 提供安全可控的浏览器历史操作，用于spa无刷新跳转：pushstate添加新条目，replacestate替换当前条目，popstate监听导航事件，go/back/forward控制跳转。

javascript 通过 history api 提供了一套安全、可控的方式操作浏览器的历史记录，主要用于单页应用（spa）中实现无刷新跳转和状态管理。它不能读取用户完整历史（出于隐私限制），但允许你添加、替换当前条目，或前进/后退。

使用 pushState() 添加新历史条目

在不刷新页面的前提下，向浏览器历史栈中添加一条新记录，常用于模拟页面跳转：

• 语法：history.pushState(state, title, url)
• state：一个可序列化的对象，随该历史条目一起保存，后续通过 popstate 事件获取
• title：目前大多数浏览器忽略该参数，传空字符串 "" 即可
• url：将显示在地址栏的新路径（必须同源，否则报错）

示例：点击按钮后更新 URL 并保存状态

history.pushState({ page: "detail", id: 123 }, "", "/product/123");

使用 replaceState() 替换当前历史条目

不新增条目，而是用新状态和 URL 覆盖当前历史记录，适合修正当前页的 URL 或状态（比如表单提交后清理查询参数）：

• 语法与 pushState 相同：history.replaceState(state, title, url)
• 不会导致用户多按一次“返回”才能离开当前页

示例：去掉 URL 中的临时参数，但保留页面内容

Java JDK 25

Java JDK 25 来自 OpenJDK 官方归档，版本为 JDK 25，本条下载地址已指向官方 Windows x64 zip 安装包直链，适合调试旧项目或兼容旧版 Java 运行环境。

下载

history.replaceState(null, "", window.location.pathname);

监听 popstate 事件响应浏览器导航

当用户点击前进/后退按钮，或调用 history.back()/history.forward() 时触发，用于同步页面状态：

• 事件对象的 state 属性即为对应历史条目中保存的 state 对象
• 注意：页面首次加载时不会触发 popstate，需手动初始化状态

示例：

window.addEventListener("popstate", (event) => {
  if (event.state) {
    renderPage(event.state); // 根据 state 渲染对应内容
  }
});

配合 go()、back() 和 forward() 控制导航

这些方法不修改历史内容，只改变当前激活的历史位置：

• history.back() 等价于 history.go(-1)
• history.forward() 等价于 history.go(1)
• history.go(n)：跳转到相对当前位置的第 n 条记录（n 可正可负）

注意：这些调用同样会触发 popstate 事件，适合封装成自定义导航函数。

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南