pageshow 事件只能通过 window.addEventListener 进行绑定，不能直接内联写在 body 标签上。当 event.persisted 的值为 true 时，通常表示当前页面是从 bfcache（浏览器前进后退缓存）中恢复的，常见于用户点击浏览器后退按钮或前进按钮；而当它的值为 false 时，则说明页面属于首次打开、正常刷新或重新加载。不过需要特别注意，判断页面是否通过前进/后退按钮进入时，最好结合 navigation type 或前端框架的路由钩子一起使用，否则在某些场景下很容易出现误判。
onpageshow 不能写在
如果直接在 中设置该属性，通常是不会生效的。原因在于，pageshow 属于页面级的全局生命周期事件，它的触发时机往往早于 DOM 完整解析，此时 标签可能还没有完成挂载；另外，该事件本身也不会冒泡，因此内联写法无法稳定接收到事件。实际测试表明，Chrome 11+、Firefox 5+、Safari 等主流浏览器中，这种写法都无法可靠触发。
event.persisted 是判断页面前进后退加载的核心依据
正确做法是使用 window.addEventListener("pageshow", ...) 来监听，并从事件对象中读取 event.persisted：
event.persisted === true→ 页面从 bfcache 恢复，典型情况就是用户点击了浏览器后退/前进按钮，或者执行了history.back()/history.forward()event.persisted === false→ 页面属于首次加载、手动刷新，或通过新标签页打开
如果你使用的是 jQuery，需要写成 event.originalEvent.persisted，否则无法正确获取该值。
常见误判场景和处理方法
仅依赖 pageshow + persisted 来判断页面是否由后退前进按钮载入，仍然不够严谨，实际开发中很容易踩坑：
- 当用户手动修改 URL 后再点击后退时，
pageshow依旧可能触发，且persisted为true，但这并不一定等同于“纯粹的后退返回”。这时应结合performance.getEntriesByType("na vigation")，检查最近一次导航记录中的type是否为"back_forward" - 在 SPA 单页应用（例如 React Router）中，路由通常由框架接管。虽然原生
pageshow仍可能触发，但业务逻辑更适合优先使用路由库提供的useEffect、onPopState等钩子，避免与框架状态管理发生冲突 pageshow会在页面恢复时立即触发，但此时 DOM 不一定完全可操作。如果需要访问页面元素，建议同时判断document.readyState === "complete"，或结合DOMContentLoaded一起处理
不要用 onbeforeunload 或 popstate 来替代
这些事件的用途并不相同，如果混合使用，往往会导致判断结果不准确：
onbeforeunload是页面离开前触发的事件，无法用来判断“页面是如何进入的”，它只负责提示“即将离开”popstate主要响应由pushState/replaceState相关历史记录变更引发的导航，对于普通链接跳转、页面刷新，以及未基于 history API 的后退按钮行为，并不能完整覆盖pagehide虽然和pageshow成对出现，但它表达的是“页面即将被隐藏”，并不直接提供来源判断信息。这里的event.persisted同样有参考价值，不过更多用于保存页面状态，而不是识别入口来源
如果你的目标是准确区分“当前页面是不是通过浏览器后退按钮或前进按钮进入的”，那么 window.pageshow 配合 event.persisted 仍然是目前最直接、兼容性也最好的方案，其他方式更多只能作为辅助判断，而不能完全替代。
