动态修改 document.title 是提升用户体验最轻量直接的方式，包括表单编辑加星号提醒、未读消息数同步、spa 路由即时反馈、搜索结果语义化标题等，需兼顾可读性、长度控制与初始标题合理性。

直接用 document.title 动态改标题，是提升用户体验最轻量、最直接的方式——它不刷新页面，不打断操作，却能让用户一眼确认当前状态。

表单编辑时加提示，避免误关页

用户正在编辑内容但还没保存，如果直接关闭标签页，容易丢失数据。这时在标题前加「*」是最直观的提醒方式：

• 监听输入框的 input 或 blur 事件
• 对比原始值与当前值，有改动就加星号，保存后移除
• 示例：document.title = hasUnsaved ? `* ${baseTitle}` : baseTitle;

未读消息数实时同步到标题

聊天页、通知中心等场景下，把未读数嵌入标题，比单纯靠角标更可靠（尤其在多标签页中）：

使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件

如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Andr​​oid友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Andr​​oid应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更

下载

• 收到新消息时更新标题，如 document.title = `(${count}) 消息 - 我的后台`;
• 用户切换回页面时，可自动清零或恢复默认标题（监听 visibilitychange）
• 注意控制长度：超过 50 字符可能被截断，中文建议 ≤12 个字+数字

单页应用路由切换即时反馈

SPA 页面无刷新跳转，用户容易迷失位置。标题及时变化，就是最基础的导航锚点：

• Vue Router 用 beforeEach，React Router 用 useEffect 监听 location 变化
• 必须配合 history.replaceState() 同步 history 标题，否则“后退”时显示旧标题
• 推荐结构：document.title = titleMap[path] || '默认页'; history.replaceState(null, document.title, location.href);

搜索/筛选结果页生成语义化标题

用户输入关键词或选择筛选条件后，标题应如实反映当前视图，而不是停留在“搜索页”这种泛称：

• 从 URL 参数或状态中提取关键信息，拼成自然语言标题
• 例如搜索“蓝牙耳机”，标题变为 搜索 “蓝牙耳机” - 数码商城
• 避免堆砌符号，用中文顿号或英文短横分隔，兼顾可读性与 SEO 基础

不复杂但容易忽略：标题变化要真实反映用户所处上下文，不是为了炫技，而是降低认知负担。服务端必须输出有意义的初始标题，JS 修改只是后续体验补全。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！