替换 Child 给出错误（无法在节点上执行 "replacechild"）？

Question

希望大家一切顺利

当我遇到这个错误时我正在使用 replacechild:

未捕获的 DOMException：无法在 'Node' 上执行 'replaceChild'：要替换的节点不是该节点的子节点。

但我看到代码没问题，我找不到任何问题

代码如下：

Javascript代码：

let list = document.getElementById("List");
list.replaceChild(text2, document.getElementById("last"));

HTML代码：

<ol id="List">
  <li><div class="child" id="first">Child 1</div></li>
  <li><div class="child" id="Second">Child 2</div></li>
  <li><div class="child">Child 3</div></li>
  <li><div class="child" id="last">Child 4</div></li>
</ol>

我用来替换 child 的文字：

let text2 = document.createTextNode("This is a heading");

谢谢

Answer 1

带有 id = "last" 的元素不是带有 id = "List" 的元素的子元素。请注意，它们之间有一个 li 元素。根据documentation，被替换的元素必须是直接子元素。示例如下：

const text = document.createTextNode("This is a heading");
const list = document.getElementById("list");
const selectedNode = document.getElementById("last");
selectedNode.parentElement.replaceChild(text, selectedNode);

<ol id="list">
  <li><div class="child" id="first">Child 1</div></li>
  <li><div class="child" id="Second">Child 2</div></li>
  <li><div class="child">Child 3</div></li>
  <li><div class="child" id="last">Child 4</div></li>
</ol>

Answer 2

id="last" 的

元素不是 ID 为 "list" 的 child 元素。它是最后一个

元素的 child。

第二个问题是

。您不能将其替换为文本节点。

如果你想简单地改变最后一里的文字，你应该使用类似的东西。
```
document.getElementById("last").innerHTML = "This is a heading";
```
但这不会使其成为标题，只是更改文本。在我看来，您应该更多地研究 html 和 DOM 以理解这些概念。

替换 Child 给出错误（无法在节点上执行 "replacechild"）？

Replace Child giving error (failed to execute "replacechild" on node)?

javascript

replace

parent-child

getelementbyid