将内容从 div 复制到页面标题时，如何防止“&”字符的 HTML 编码？

Question

我有一个 div，其内容是“我的主页和管理”
<div id="abc"> My Home & Administration></div>

在脚本中，我需要将此 div 的内容复制到我的页面标题中。目前我正在使用对值进行编码的innerHTML 属性。

<script type="text/javascript>
var id = document.getElementById("abc");
document.title = id.innerHTML;
</script>

标题显示为“我的家” 管理 （注意：忽略 & 和 amp; 之间的空格）

有没有其他方法可以按原样显示标题？ 除了纯粹简单的 Javascript 之外，我无法使用 JQuery 或任何框架

另请注意，这不是 URL 编码，而是字符到 HTML 实体的转换。

Answer 1

您可以使用.textContent代替.innerHTML.

.innerHTML实际上不是 DOM 规范的一部分。大多数浏览器将其作为非标准功能提供。有几个问题.innerHTML。

由于您对节点的实际文本值感兴趣，因此可以使用.textContent.

知道div abc内部实际上有一个节点 a ，TextNode它保存该值可能会很有用。它div本身实际上并不具有价值。如果你要遍历 DOM，你会看到这个文本节点。

如果您的 HTML 是：

<div id="abc">Foo <strong>bar</strong> baz</div>

你的结构将是：

`div`:abc
  TextNode Foo
  `strong`
    TextNode bar
  TextNode baz

在这种情况abc.textContent下将返回，"Foo bar baz"因此它会忽略该strong标签。

比较.innerHTML会返回"Foo <strong>bar</strong> baz"

同样对于：

<div id="abc">Foo&amp;Bar</div>

.textContent将会是"Foo&Bar",.innerHTML将会是"Foo&Bar"