history.pushstate() 的 title 参数被所有主流浏览器忽略，无法语义化历史记录；真正起作用的是第一个参数 state 对象，它会被序列化保存并在 popstate 事件中完整返回，用于驱动标题、路由等状态同步。
HTML 文档标题（document.title）本身不参与历史栈管理，无法“语义化”历史记录；真正起作用的是 history.pushState() 的第一个参数（state 对象），而 title 参数在现代浏览器中被忽略——强行依赖它会导致历史状态丢失、后退失效。
为什么 history.pushState() 的 title 参数没用
规范早已明确：Chrome、Firefox、Safari 等主流浏览器完全忽略 pushState() 的第二个参数（title）。写成 history.pushState({}, 'About Page', '/about')，页面标题不会变，历史记录里也查不到这个字符串。
- 它不是历史条目的“名称”，浏览器开发者工具的“Application → History”面板里看不到该值
- 它不参与
popstate事件的event.state，你取不到 - 试图靠它做路由调试或状态识别，一定会失败
真正能语义化历史栈的是 state 对象
你要存的语义信息（比如当前是哪个标签页、是否带筛选参数、页面版本号）必须塞进 pushState() 的第一个参数——那个 state 对象。它会被序列化并持久保存在历史记录中，且在 popstate 时原样返回。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 推荐至少包含
page或tabId字段，例如：{ page: 'settings', section: 'profile', ts: Date.now() } - 避免放函数、DOM 节点、大数组——浏览器对单条
state有大小限制（通常 ≤ 640KB） - 不要重复存 URL 路径：路径已由第三个参数（
url）决定，state只存无法从路径推导的上下文
如何让文档标题和路由状态保持同步
document.title 是独立控制的 UI 层面变量，需手动与路由状态对齐。关键不是“用标题驱动历史”，而是“用历史状态驱动标题”。
- 每次成功调用
pushState()后，立刻执行document.title = '关于页面 - MyApp' - 在
popstate回调里，从event.state读出语义字段，再设置document.title - 首次加载页面时（
popstate不触发），要主动调用一次渲染逻辑，否则首屏标题可能错乱 - 如果用 React/Vue，别在组件
useEffect或mounted里硬编码标题——应从路由状态派生，确保服务端渲染（SSR）时也能一致
容易被忽略的兼容性陷阱
看似简单的标题同步，实际在两个地方极易翻车：
-
popstate事件不触发于初始页面加载——你必须在 JS 启动时手动读取window.location.pathname并初始化document.title，否则刷新后标题就丢了 - 用户手动修改地址栏再回车，会触发完整页面重载（非 SPA 导航），此时
state对象彻底丢失，只能靠 URL 解析还原标题——所以 URL 路径设计要有可读性，比如用/blog/react-router-guide而非/p?id=123
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
