回到课程

对比 createTextNode、innerHTML 和 textContent

重要程度: 5

我们有一个空的 DOM 元素 elem 和一个字符串 text

以下这三个命令行的结果是一样的吗?

  1. elem.append(document.createTextNode(text))
  2. elem.innerHTML = text
  3. elem.textContent = text

回答:1 和 3

所有命令行都是将 text “作为文本”添加到 elem

这里有个简单的例子:

<div id="elem1"></div>
<div id="elem2"></div>
<div id="elem3"></div>
<script>
  let text = '<b>text</b>';

  elem1.append(document.createTextNode(text));
  elem2.textContent = text;
  elem3.innerHTML = text;
</script>