javascript 的 history api 仅支持同源的添加、替换和导航操作，不允读取或删除历史条目；pushstate/replacestate 修改 url 和状态但不刷新页面，需服务器支持对应路由；popstate 监听导航变化，首次加载不触发，须手动检查 history.state。
JavaScript 中不能直接读取或删除历史记录条目，只能在当前会话中添加、替换或后退/前进——这是浏览器安全模型决定的，history API 本质上是单向、受限的操作接口。
为什么 history.pushState() 不触发页面刷新
它只修改 URL 和历史栈，不发起新请求，适合单页应用（SPA）做无刷新路由。但注意：pushState() 后如果用户手动刷新页面，服务器必须能响应这个 URL，否则 404。
- 第一个参数
state是任意可序列化的对象，会随该历史项保存，后续popstate事件中可通过event.state取出 - 第二个参数
title当前所有主流浏览器都忽略，传空字符串即可："" - 第三个参数
url必须与当前域同源，且不能是完整 URL（如不能含http://），否则抛出SecurityError
history.pushState({ page: "dashboard" }, "", "/dashboard?tab=stats");
history.replaceState() 和 pushState() 的关键区别
两者参数完全一致，但 replaceState() 不新增历史项，而是替换当前项——适合修正 URL 而不希望用户能“后退”到旧地址的场景，比如表单提交后清理查询参数。
- 不会导致历史栈长度变化：
history.length不变 - 同样要求
url同源，否则报错 - 常用于：登录跳转后清除
?token=xxx、搜索后移除冗余page=1
history.replaceState(null, "", "/search?q=js");
监听地址变化必须用 popstate，不是 hashchange
popstate 在用户点击浏览器后退/前进按钮、或调用 history.back()/history.forward() 时触发；而 hashchange 只响应 # 后面的变化，两者互不替代。
立即学习“Java免费学习笔记（深入）”；
-
popstate事件对象的state属性就是之前pushState或replaceState传入的状态对象 - 页面首次加载时不会触发
popstate，哪怕 URL 带有 state —— 需要手动检查history.state - 不要在
popstate里直接调用pushState，容易陷入循环（Chrome 会警告，Firefox 可能卡死）
window.addEventListener("popstate", (event) => {
if (event.state?.page === "profile") {
loadProfile();
}
});
history.go()、back()、forward() 的实际限制
它们只是快捷方式：back() 等价于 go(-1)，forward() 等价于 go(1)。但能否成功取决于历史栈深度和跨域策略。
-
history.length返回的是「当前窗口会话中」的历史条目数，不含 iframe 或其他 tab 的记录 - 调用
go(n)时若目标超出范围（比如 n = -100 但只有 3 条记录），静默失败，不报错也不跳转 - 如果历史项来自不同源（比如从 google.com 点链接进你的站点），该条目不可访问，
go()会跳过它
真正难处理的是状态同步：比如用户用 pushState 改了 URL，但没更新页面 DOM，再点后退就看到旧内容；或者 popstate 处理函数里异步加载数据，期间用户又点了前进，就可能状态错乱。这类问题没法靠 API 本身解决，得靠应用层加锁或取消未完成请求。
