translate属性仅影响浏览器内置翻译功能,对Google Translate网页版、API及嵌入式翻译框无效;Chrome等主流浏览器支持translate="no"以跳过指定元素翻译,但需严格按标准书写且遵循继承规则。

不影响。 translate 属性只作用于浏览器内置的页面翻译功能(如 Chrome 的右键“翻译成中文”),对 Google Translate 网页版、API 或嵌入式翻译框完全无效。
Chrome 浏览器翻译时,translate="no" 会起作用
当你在网页中给某个元素加上 translate="no",Chrome 检测到该属性后,会在翻译整个页面时跳过这个节点及其子节点。这是 W3C 标准属性,被主流浏览器(Chrome、Edge、Firefox)支持。
- 常见用法:
<p translate="no">v1.2.3</p>、<span translate="no">API_KEY</span> - 注意:必须是
translate="no",写成translate="false"或translate(无值)均无效 - 父元素设为
translate="no",子元素即使显式写translate="yes"也不会被翻译(继承优先)
Google Translate 网页版(translate.google.com)无视 translate 属性
Google 自家的翻译服务不读取或解析 HTML 的 translate 属性。它依赖自己的内容抽取和语义分析逻辑,只看文本内容本身,不会检查 DOM 属性。
- 你打开
https://translate.google.com/?sl=auto&tl=zh&u=https://example.com,页面照样全量翻译 - 哪怕整页都加了
translate="no",Google Translate 也不会因此跳过任何段落 - 想控制 Google Translate 的行为?只能靠服务端返回时过滤/替换敏感文本,或用
<meta name="google" content="notranslate">(仅对部分旧版爬虫/界面有效,不保证)
使用 Google Cloud Translation API 时,translate 属性毫无意义
API 接收的是纯文本或 HTML 字符串,你传什么它就译什么。HTML 标签会被当作普通字符处理(除非启用 mime_type: "text/html" 且明确要求保留标签结构)。
- 传入:
<div translate="no">Hello</div>→ 默认输出:<div translate="no">你好</div> - 若想跳过某段文本,得在调用前手动提取、过滤、拼接 —— API 不识别任何 HTML 属性
- 性能提示:带大量无关属性的 HTML 会增大请求体积,建议预处理清理冗余属性再送入 API
真正容易被忽略的是边界场景:比如用 translate="no" 保护一段用户生成内容(UGC),但该内容又被 JavaScript 动态插入到一个 translate="yes" 的容器里 —— 此时浏览器可能仍会翻译它,因为属性继承规则在动态 DOM 中有时表现不一致。遇到这类情况,最好直接用 CSS content 或 data- 属性存放非翻译文本,再由 JS 注入,彻底绕过翻译引擎的文本扫描路径。

















