Javascript 错误：无法执行'；removeChild'；在'；节点'；

我对javascript和编程基本上是新手。我已经准备好了我的第一个浏览器游戏，当一切正常时，我在控制台中不断收到一个令人讨厌的错误，在我的悬停函数中说，“NotFoundError:未能在'Node'上执行'removeChild'：要删除的节点不是这个节点的子节点”

function hover(myid) {
var id = myid;
var index = id[5];
document.getElementById(id).removeChild(GAME.mound[index]);
document.getElementById(id).appendChild(GAME.hover[index]);
GAME.sound[0].play();
}

GAME.mound和GAME.hover都是存储图像的数组。我搞不清楚的是，我有一个函数，它几乎与反转悬停函数引起的图像切换相同，但它不会抛出错误

function out(myid) {
var id = myid;
var index = id[5];
document.getElementById(id).removeChild(GAME.hover[index]);
document.getElementById(id).appendChild(GAME.mound[index]);
}

下面是HTML中调用函数的一行：

<div id="drift0" class="snowdrift" onmouseover = "hover(this.id)" onmouseout = "out(this.id)" onclick = "popup(this.id)"></div>

非常感谢您在这方面的任何帮助。如果我没有提供回答问题所需的所有信息，请告诉我

---

谢谢

如果两次调用hover而中间没有out，则会出现此问题。异常将导致回调退出-这不会导致问题，因为appendChild在前一次被调用。我不记得确切的边缘情况，但我确实在前一段时间看过这个。我建议您保留一个标志，以确保它们仅作为切换执行

如果你什么都不做，这不是致命的，尽管我不知道性能的缺点是什么。最简单（如果不是最漂亮的话）的解决方案是将其包装在一个try-catch中：

try {
  document.getElementById(id).removeChild(GAME.mound[index]);
  document.getElementById(id).appendChild(GAME.hover[index]);
} catch(e) {}

最好查看您的代码，看看问题是什么，和/或找到一种解决方法来阻止异常的发生。

---

GAME.sound[0]。play（）

似乎您需要处理此异常，所以请这样做。复制myid似乎没有任何意义，它是一个字符串，即使您修改它，原始ID也不会更改。您应该将对元素的引用传递给侦听器，而不是ID，因为它使用getElementById保存了两次

此外，正如Deryck所建议的，将在一个步骤中完成更改：

function hover(myid) {
  var el = document.getElementById(myid);
  var index = myid[5];

  if (GAME.mound[index].parentNode === el) {
    // Replace mound image with hover image
    e.replaceChild(GAME.hover[index], GAME.mound[index]);
  }
  GAME.sound[0].play();
}

如果将其传递给函数而不是此.id，则可以执行以下操作：

function hover(el) {
  var index = el.id[5];

  if (GAME.mound[index].parentNode === el) {
    e.replaceChild(GAME.hover[index], GAME.mound[index]);
  }
  GAME.sound[0].play();
}

---

除了这段代码没有显示该“节点”的任何插入点之外，您还可以说它是一个图像数组——假设您实际上在某处将其转换为DOM节点，那么图像数组实际上是一个节点列表，不能仅使用

removeChild

一次处理所有图像。我建议使用

for

循环对其进行迭代，并使用

replaceChild（newChild，oldChild）

而不是当前用于删除然后追加的内容。@Deryck HTMLCollections与数组只有最相似之处，但是建议替换孩子是个好主意。try.。只有在没有其他方法检测或避免错误的情况下，才能将catch用作最后手段。首先检查这个游戏效率更高。在尝试删除它之前，mound[index]是元素的子元素。同意，正如我在最后一段中指出的。它需要更多关于代码库的信息来实现正确的解决方案。我将其传递给函数，而不是this.id。我不理解节点和元素之间的区别。您推荐的任何资源都可以帮助我更好地了解节点的工作方式？a是DOM中的基本实体（文档是节点树）。有12种类型，其中一种是。DOM核心设计用于处理任何类型的文档，HTML和XML是最常见的。现在阅读，看看我是否能更好地处理这个话题。