改网页标题只有两种可靠方式：静态写在里的，或运行时用document.title赋值；其他操作均不保证生效，尤其影响SEO和历史记录。

改网页标题只有两种可靠方式：静态写在 里的 ，或运行时用 document.title 赋值。其他任何操作——比如 querySelector('title').textContent、往 里塞 、用 JS 插入新 标签——都不保证生效，尤其对 SEO 和历史记录。

为什么 必须放在 里

HTML 规范强制要求 是 的直接子元素。浏览器解析时若在 中遇到它，会尝试“修复”并挪动，但这个过程不可控：

• 旧版 Safari 或某些 WebView 可能静默丢弃，导致标签页显示“无标题”或文件名
• 搜索引擎爬虫直接忽略非 内的 ，SEO 失效
• 部分构建工具（如 Vite 的 html-plugin）会覆盖模板中写的 ，得查最终生成的 HTML 源码确认

document.title 是唯一安全的动态修改方式

单页应用（SPA）路由切换后必须手动调用它，否则前进/后退时标题不会更新。注意几个关键点：

HTML Text Extract

从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

下载

• document.querySelector('title').textContent = '新标题' 不生效—— 是特殊节点，DOM 操作不触发浏览器标题栏更新
• 所有现代浏览器（包括微信内置浏览器）都支持 document.title 读写，但 IE6–8 对含中文的标题有兼容问题，需确保页面声明了
• document.title 修改不触发任何事件，也不影响 history.state，别指望靠监听它做响应

标题内容本身容易踩的坑

即使位置和 API 都对了，标题内容写错照样出问题：

• 长度超过 50 字符，移动端和搜索结果页大概率被截断；微信分享卡片也会自动加省略号
• 含未转义的 &、、> 会被当成 HTML 标签解析，轻则显示异常，重则破坏整个 结构；& 必须写成 &
• 服务端模板（如 PHP、Jinja）里如果 被拆开拼接，容易漏掉或重复插入 ，导致只取第一个、其余被忽略
• 构建产物中的 可能和源码不一致——务必用 curl -s URL | grep " 或“查看网页源码”（不是 Elements 面板）验证真实输出

最常被忽略的是：你本地刷新看到标题变了，不代表爬虫也看到了。首屏 HTML 源码里没有有效 ，SEO 就没地基可打。

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