我可以使用setAttribute更改文本节点内的文本吗？

Question

我知道我可以使用nodeValue更改文本内部的文本，例如
element.firstChild.nodeValue = text
但是我可以使用setAttribute执行相同的操作吗？

HTML：

<p id="description">Some text here.</p>

JS：

var description = document.getElementById("description");
description.setAttribute(nodeValue, text);

它不起作用。这是否意味着“nodeValue”不是元素的属性？

Answer 1

没有。 setAttribute确实设置了一个属性。它没有设置内容。

但是，您可以使用CSS显示属性，就好像它是内容一样。

var description = document.getElementById("description");
description.setAttribute('data-content', 'Updated text');

#description::after {
  content: attr(data-content);
}

<p id="description" data-content="Some text here."></p>

这只应用于样式设计，而不是插入真实内容。

Answer 2

您希望在此处设置节点内容而不是节点属性，以便您可以使用 http://sqlfiddle.com/#!9/35288d ：

// Set the text content:
description.textContent = text;

希望这有帮助。

var description = document.getElementById("description");
var text = 'New text';

description.textContent = text;

<p id="description">Some text here.</p>

Answer 3

不，你不能。 setAttribute用于处理HTML元素属性。

例如，如果您想要更新要禁用的按钮，您可以执行以下操作：

var button = document.querySelector('my-button');
button.setAttribute('disabled', 'disabled');

要更改文字，请使用textContent：

var description = document.getElementById("description");
description.textContent('New text here.');