lang属性不触发浏览器自动翻译，但影响翻译准确性、屏幕阅读器语音引擎、拼写检查、seo语言识别；必须严格匹配内容主语言并遵循bcp 47格式。
lang 属性本身不驱动浏览器翻译，它只提供语言“声明”；浏览器是否自动翻译、怎么翻译，完全由用户设置和 UA 行为决定，不是你写了 lang 就会触发。
lang 属性到底影响哪些浏览器行为？
它不控制翻译开关，但会影响翻译的准确性和上下文判断：
-
lang值是浏览器翻译功能识别“这段文字该用什么模型处理”的首要依据——比如<p lang="ja">こんにちは</p>更可能被 Chrome 识别为日语并调用日语翻译模型，而非误判为乱码或中文 - 屏幕阅读器（如 NVDA、VoiceOver）严格依赖
lang切换语音引擎和发音规则；写错或遗漏会导致朗读腔调错乱、标点停顿异常 - 拼写检查默认启用语言由
决定；局部lang可让<textarea lang="fr"></textarea>触发法语词典校验 - SEO 中，Google 会把
作为页面主语言信号之一，影响搜索结果的语言分流
为什么写了 lang="en" 页面还是被当成中文翻译？
常见错误现象：页面主体是英文，但 没改，用户点“翻译成中文”，结果浏览器先把英文原文用中文模型“翻译”一遍，再翻回英文——语义全毁。
实操建议：
- 必须确保
根元素的lang值与当前渲染内容的主语言严格一致；切换语言时，第一件事就是document.documentElement.lang = "en" - 不要依赖 JS 动态修改根
lang后“自动重译”——已渲染的 DOM 不会重新触发翻译逻辑，必须手动刷新或用location.reload() - 局部多语言内容（如代码块、引文、术语）必须显式加
lang，例如：<pre class="brush:php;toolbar:false;" lang="bash">curl -X POST</pre>或<blockquote lang="de">...</blockquote> - 避免使用非标准值，如
zh_CN、english；应严格用 BCP 47 格式：zh-Hans、en-US、pt-BR
hreflang 和 lang 混用会怎样？
典型误用：在中文页里加 <link rel="alternate" hreflang="en" href="/en/">，就以为用户点进去会自动“变成英文页”——其实不会。目标页若没写 ，照样按中文渲染，字体错、标点挤、语音乱。
关键区别：
-
lang是内容层标记，告诉浏览器“这段是什么语言”，影响渲染、朗读、拼写检查 -
hreflang是链接关系声明，只对搜索引擎生效，用于多语言站点 URL 分流，和页面内语言识别完全无关 - 两者必须配合：hreflang 指向的页面，其
必须匹配 hreflang 声明的语言值
真正容易被忽略的点是：SPA 中语言切换后，仅更新文案文本远远不够；document.documentElement.lang、所有带 lang 的子元素、dir 属性、甚至 <meta name="description"> 的内容，都得同步更新——否则辅助技术会持续卡在旧语言上下文里，无法正确响应后续交互。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
