HTMLElement: translate 属性

基线 2023

新可用

2023 年 3 月起,此功能在最新的设备和浏览器版本上都能正常使用。此功能可能无法在旧设备或浏览器上正常使用。

translate 属性是 HTMLElement 接口的一个属性,它指示当页面本地化时,元素的属性值及其 Text 节点子节点的值是否应该被翻译,或者是否应该保持不变。

它反映了 translate HTML 全局属性的值。

如果元素的属性值及其 Text 节点子节点的值在页面本地化时应该被翻译,则该布尔值将为 true,否则为 false

示例

以下示例演示了如何通过脚本启用或禁用翻译

html
<div>
  <span>The content may always be translated: </span>
  <span translate="yes">El contenido será traducido</div>
</div>
<div>
  <span id="translate-label">The content may be translated:</span>
  <span id="translate-element" translate="no">El contenido puede ser traducido.</div>
</div>
<input id="translate-controller" type="checkbox" /> Enable translation
js
const label = document.getElementById("translate-label");
const element = document.getElementById("translate-element");
const controller = document.getElementById("translate-controller");

controller.addEventListener("change", (e) => {
  if (controller.checked) {
    element.translate = true;
    label.innerText = "The content may be translated:";
  } else {
    element.translate = false;
    label.innerText = "The content may not be translated:";
  }
});

规范

规范
HTML 标准
# dom-translate

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅