纯 JavaScript：在鼠标悬停时删除元素 [重复]答案

【问题标题】：Pure JavaScript: Remove element on mouseover [duplicate]纯 JavaScript：在鼠标悬停时删除元素 [重复]
【发布时间】：2019-10-28 11:14:20
【问题描述】：

我需要这样的函数：

document.getElementsByTagName("div").addEventListener("mouseover", mouseOver);

function mouseOver() {
document.getElementsByTagName("div").remove;
}

&lt;div style="width: 100px; height: 100px; background-color: red; position: absolute"&gt;&lt;/div&gt;

所以我必须选择标签名称并在鼠标悬停时将其删除。这怎么可能编码？

【问题讨论】：

除了issue addressed by the linked question，在您的处理程序中使用this 来访问与事件相关的元素。（或者接受事件对象参数并使用event.currentTarget。）另外，要调用函数，您需要在名称后加上()。
@T.J.Crowder 我不认为它是重复的。我必须使用纯 JavaScript。我真的不明白。究竟缺少什么？
是的，上面的主要问题是该问题的重复。（我不明白你为什么提到“纯 JavaScript”，在另一个问题中没有使用任何库或类似的东西。）你需要遍历集合，你不在上面；有关详细信息，请参阅该问题的答案。然后，除此之外，你还需要做我上面描述的事情。
例如：function mouseOver() { this.parentNode.remove(this); } var list = document.getElementsByTagName("div"); for (var i = 0; i < list.length; ++i) { list[i].addEventListener("mouseover", mouseOver); }（现代浏览器上有更短的方法；该代码将一直工作到 IE9。）在现代浏览器上：function mouseOver() { this.remove(); } document.querySelectorAll("div").forEach(function(div) { div.addEventListener("mouseover", mouseOver); });
@T.J.Crowder 我将拥有多个 div，并且只想删除悬停的那些。使用您的代码，一切都将被删除...

【解决方案1】：

实际上，您已经有了解决方案。你只需要修复你的回调来调用 remove 方法：

function mouseOver(event) {
  event.target.remove();
}

【讨论】：