标签必须且只能位于内，浏览器仅识别首个；写错位置或重复将导致标题不显示、seo失效；动态修改须用document.title。
title 标签必须放在
不是“可能不显示”，而是 HTML 解析器在构建 DOM 前就跳过 <title></title>——它只扫描 区域提取标题。写在 开头？Chrome 可能自动挪，但爬虫、微信内置浏览器、旧版 Safari WebView 直接忽略，标签页显示 index.html 或“无标题”。常见漏点： 被模板拆成多个片段（如 EJS 的 ），<title></title> 实际插到了 渲染逻辑里；或整个 HTML 漏写 标签，<title></title> 直接跟在 后面。
一个页面只能有一个 <title></title>，多写等于白写
HTML5 规范强制要求 <title></title> 是 的唯一子元素。浏览器只取第一个，其余全部静默丢弃——不报错、不合并、不警告。典型误用：html-webpack-plugin 配置了 title: '我的网站'，你又在模板里手写一个 <title>首页</title>，后者被覆盖；SPA 中 JS 动态插入新 <title></title> 却没移除旧的；多语言站点用条件渲染生成多个 <title></title>，结果只生效第一个。
动态改标题必须用 document.title，别碰 DOM
单页应用路由切换时，document.querySelector('title').textContent = '新标题' 看似改了节点，但标签页文字完全不变——规范明确要求只有赋值 document.title 才触发更新逻辑。注意几个硬限制：document.title 是可读写属性，直接赋字符串即可，比如 document.title = '用户中心 | MyApp'；特殊字符（如 &、、<code>>）在 JS 赋值时无需手动转义，内部自动处理；但服务端渲染或静态 HTML 中的原始 <title></title> 仍需转义，否则 <title>A & B</title> 会破坏 HTML 结构。
构建工具可能悄悄覆盖你写的 <title></title>
Vite 的 vite-plugin-html、Webpack 的 html-webpack-plugin 默认通过配置项注入标题，比如 title: '我的网站'。你源码里写的 <title>首页</title> 看着正常，构建后 dist/index.html 里早就被替换成插件生成的内容。排查方法很简单：不要看源码，直接打开最终输出的 index.html 文件搜索 <title></title>；检查插件配置是否启用了 templateParameters 或 inject: true；需要自定义时，优先用插件提供的变量注入，而不是硬写静态 <title></title>。
最容易被忽略的是初始加载那一刻的标题——它永远只认 里的那个 <title></title> 标签。JS 后改的 document.title 只影响当前标签页，微信/QQ 分享卡片、SEO 抓取、书签命名，全靠这个静态标签撑着。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
