javascript历史记录API是什么_如何操作浏览器的历史栈？

History API 通过 history.pushState() 和 replaceState() 实现无刷新 URL 变更与历史管理，配合 popstate 事件监听导航，支持 SPA 的前进/后退体验；需注意同源限制、state 持久化及刷新兜底。

JavaScript 历史记录 API（History API）是一组允许脚本操作浏览器会话历史的接口，核心是 history 对象。它让你能在不刷新页面的前提下，改变 URL、添加或替换历史条目，从而实现单页应用（SPA）中的“前进/后退”体验。

history.pushState()：往历史栈添加新记录

调用 pushState() 会在当前会话历史中新增一条记录，同时更新地址栏 URL（可跨路径），但不会触发页面跳转或重新加载。

语法：
history.pushState(state, title, url)

• state：一个可序列化的对象，随该历史条目一起保存，后续通过 popstate 事件可读取
• title：目前大多数浏览器忽略此参数，传空字符串或 null 即可
• url：新的相对或绝对 URL，必须同源（协议+域名+端口一致），否则报错

例如：
history.pushState({page: 'detail', id: 123}, '', '/post/123');
执行后地址栏变为 /post/123，用户点「后退」会回到上一条记录。

history.replaceState()：替换当前历史记录

和 pushState() 类似，但不新增条目，而是直接修改当前历史项的 state 和 URL。

立即学习“Java免费学习笔记（深入）”；

适用场景：表单提交后修正 URL，或初始化时同步 URL 与视图状态（避免多按一次后退回到空白页）。

标签： javascript java go 浏览器 端口 栈 ai win 表单提交