lang 属性必须写在 标签上，因为浏览器和辅助技术仅在解析 HTML 最早阶段读取该声明以加载语音库、切分音节、触发翻译等；其他位置（如 、 或 JS 设置）均无效。
lang 属性必须写在 标签上，其他位置无效——这是唯一被浏览器、屏幕阅读器（如 NVDA、VoiceOver）、搜索引擎和 Chrome 翻译按钮识别的页面语言声明方式。
为什么只能写在
浏览器和辅助技术在解析 HTML 的最早阶段就读取 ，并据此加载语音库、切分音节、匹配词典、触发翻译入口。写在 、 或用 JS 动态设置，都晚于这个时机。
-
：仅影响该元素内文本的:lang()CSS 匹配和局部断词，不改变页面级语言 -
：HTML5 已废弃，完全被忽略 -
document.documentElement.lang = "zh-CN"（JS 设置）：对已激活的屏幕阅读器无效，它只读初始 HTML 字符串
lang 值怎么写才不被当成错误
必须严格遵循 BCP 47 规范，大小写、连字符、子标签顺序都有语义含义；非法值（如 zh_china、Chinese、zh）会被静默忽略或识别为“未知语言”。
- 中文优先用
zh-CN（简体+中国大陆），不是zh或zh-Hans：前者兼容性最稳，拼音、声调、标点排版全支持；后者未绑定地域，部分旧读屏可能 fallback 到英文 TTS - 英文必须用
en-US或en-GB，不能用english、en_US（下划线非法）、EN-us（大小写错位） - 法语、葡萄牙语等小语种对大小写敏感：
fr-FR合法，FR-fr不合法 -
lang=""比不写还糟：明确告诉辅助工具“语言未知”，可能导致整页按英文规则朗读中文多音字
多语言内容怎么处理
主语言由 决定，局部切换靠子元素覆盖，无需 JS 或额外 meta。
- 英文引文：
The quick brown fox...
- 日文术语：
中文段落中嵌入日本語
- 双向文本（如阿拉伯语）要同时加
dir：مرحبا
-
title="English | 中文"），只能整体按处理，无完美解法
动态页面（React/Vue/SSR）怎么安全设 lang
客户端渲染（CSR）无法靠 JS 补救，必须在服务端或静态生成阶段注入真实语言值——否则首屏 HTML 里 lang 就是错的，后续所有链路都失效。
- Next.js：在
app/layout.tsx中通过localeprop 注入，确保 SSR 输出正确 - Nuxt：用
useLocaleHead()，它会把lang写进初始 HTML 的标签 - 纯前端 SPA：若支持多语言，必须产出多个 HTML 入口文件（如
/en/index.html和/zh/index.html），不能只靠 JS 切换文案 - 用户切换语言后，必须整页刷新或强制重载 ARIA 状态——改
document.documentElement.lang对已运行的读屏软件无效
最容易被忽略的是：页面看起来一切正常，但 lang 缺失或错误时，屏幕阅读器已在误读、Chrome 翻译按钮已消失、Google Search Console 已报“未指定语言”，而这些故障没有任何视觉提示。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
