javascript - HTML Javascript 通过 id 标记名获取 textNode 什么？

Question

有没有办法为文本节点分配一个 id，然后通过该 id 检索该文本节点？我尝试了几种不同的方法，并不断收到错误消息，提示无法获取 null 的属性。

我的代码看起来像这样......

 var myDiv = document.createdElement('div');
 myDiv.id = "textContainer";

 var textNode = document.createdTextNode("some text");
 textNode.id = "descriptionText";
 myDiv.appendChild(textNode);

到目前为止工作正常；它显示在页面上。后来我尝试修改该文本节点，这就是我遇到错误的地方。

 var tempNode = document.getElementById(descriptionText);
 descriptionText.value = "new text";

这是不行的。我已经尝试过使用标签名称、数据等通过文本节点命名的变体，但我遇到了同样的错误。那么，命名和检索文本节点是不可能的吗？下一个最佳解决方案是创建新文本节点并替换旧文本节点吗？

Answer 1

Text没有 id 的属性，因此当您将节点写入 DOM 时，将无法再以这种方式访问​​它。您在 JavaScript 中创建的内容(Text 对象)并不直接关联到像 HTMLElement 这样的 DOM 元素。 .

事实上，它甚至不被认为是父级的子级，它是父级的textContent。请注意，textContent 来自一个继承自 Node 的元素。 .

您可以在创建对象时为其分配一个“id”，因为所有对象都只是对象，但是当您将其放入 DOM 中时，所有非标准的东西都会消失。

如果您测试父元素的子元素:

myDiv.children.length;

您会看到(如果没有其他子节点)您添加的文本节点作为属性“吸收”到父节点中。

这里有点jsfiddle演示。

---

旁注:这是对浏览器中文本处理方式的过度简化。我不知道我是否会称其为粗略过度简化，但无论哪种方式都是如此。

需要注意的是 Text继承自 CharacterData又继承自 Node .但是，这些是接口(interface)，限制了可用方法/属性的范围。

此外，文本节点可以在 DOM 中始终可访问，但不能通过标识符或标签访问。 The MDN page for Node.normalize清楚地展示了这些节点如何通过 childNodes 可用只读nodeList .

虽然将这些东西放在你的后兜里很有用，但在日常使用的节点和规范化和 CharacterData 的上下文中考虑 Text 可能并不重要。