lang属性不能禁用浏览器翻译弹窗，必须配合translate="no"写在<html>标签上才有效；lang值需符合BCP 47标准（如zh-CN），且需服务端初始渲染生效。
lang 属性本身不能禁用浏览器翻译弹窗。它只声明语言，不控制翻译开关——写了 lang="zh-CN"，Chrome 该弹翻译按钮还是弹。
为什么加了 lang 还会出翻译浮层
Chrome 判断是否显示“翻译成中文”按钮，主要看两个信号：一是 <html> 标签有没有 lang，二是这个值是否明确、可信。常见失效场景：
-
lang="zh"（缺区域码）→ Chrome 视为模糊语言声明，可能忽略 -
lang="zh_CN"（下划线写法）→ 不符合 BCP 47 格式，被当无效值处理 - 页面内容是英文，但
<html lang="zh-CN">没改 → Chrome 发现内容与声明冲突，触发“疑似非当前系统语言”，强制弹窗 - 没配
translate属性 →lang单独存在，对翻译行为零约束力
真正起效的组合：lang + translate="no"
要让翻译浮层彻底消失，必须同时满足：
- 在
<html>标签上写明标准lang值，如lang="zh-CN"或lang="en-US" - 在同一标签上显式添加
translate="no"（注意：必须是小写no，不能是false、off或空字符串） - 该属性必须出现在初始 HTML 源码中，JS 后续赋值（如
document.documentElement.translate = "no"）无效
正确写法示例：<html lang="zh-CN" translate="no">
立即学习“前端免费学习笔记（深入）”；
动态切换语言时，lang 和 translate 都得手动同步
单页应用（SPA）里，仅改 document.documentElement.lang 不足以阻止翻译弹窗重现：
- 已渲染的 DOM 不会因
lang变更而重新触发翻译策略 -
translate="no"是静态属性，JS 改不了它的生效状态，除非整页刷新 - 若你用
history.pushState切换 locale，必须同时确保新页面的<html>标签在服务端或 hydration 阶段就带对lang和translate="no"
绕过刷新的底线方案：在路由切换后，用 location.reload() 强制重载，否则 Chrome 缓存的翻译策略大概率残留。
最易被忽略的一点：即使你把 translate="no" 加到了 <body> 或某个 <div> 上，Chrome 仍可能扫描 <html> 的 lang 状态并弹窗——只有根元素上的 translate="no" 才具备全局压制力。
