document.title 是最简单直接操作网页标题的 DOM 属性，既可读取也可赋值修改；动态读取只需访问 document.title，立即返回 内容。
document.title 是 JavaScript 中最简单、最直接操作网页标题的 DOM 属性，它既可读取当前页面的 <title></title> 文本内容，也能直接赋值修改——无需查询元素、不依赖 CSS 选择器，也不需要调用方法。
如何动态读取网页标题
只需访问 document.title，它会立即返回 <title>...</title> 中的纯文本内容（不含 HTML 标签）：
- 即使页面尚未完全加载，只要
<title></title>已解析，就能读取到值 - 返回的是字符串，可直接用于判断、拼接或显示，例如：
console.log(document.title); // "首页 - 示例网站"
如何动态修改网页标题
直接对 document.title 赋值新字符串，浏览器会同步更新标签页标题和 <title></title> 元素内容：
- 修改后立即生效，无需刷新页面或手动更新 DOM 节点
- 支持中文、Emoji、空格等任意合法字符，例如：
document.title = "✅ 加载完成 | " + document.title; - 注意：修改不会触发
DOMContentLoaded或titlechange事件（该事件暂未被主流浏览器广泛支持）
与 querySelector 的区别：为什么不用 document.querySelector('title').textContent？
虽然技术上可行，但不推荐用 DOM 查询方式操作标题：
立即学习“Java免费学习笔记（深入）”；
-
document.querySelector('title')返回的是<title></title>元素节点，需额外读写.textContent，更繁琐 -
<title></title>不在主渲染流中，其内容变化不会触发重排/重绘，但通过document.title操作语义更清晰、性能无差异 - 某些场景下（如 SPA 路由切换），
document.title是框架（如 Vue Router、React Router）内部更新标题的标准接口
实际使用小建议
- 单页应用中，可在路由守卫或组件挂载后设置标题：
document.title = route.meta.title || '默认标题'; - 避免频繁修改（如每秒多次），虽无性能瓶颈，但可能干扰用户对页面状态的感知
- SEO 友好提示：服务端渲染（SSR）时，
document.title在客户端生效，但搜索引擎主要抓取服务端输出的原始<title></title>，动态修改不影响初始 SEO
