javascript - 通过 onclick 事件删除 div

Question

我正在尝试使用 onclick 事件删除一个 div，但它不起作用并且 div 停留在那里，下面是我正在使用的代码，有人可以帮忙吗？

<div id="apDiv2">
    <a href="#" onclick="document.getElementById('apDiv2').removeChild(document.getElementById('apDiv1'))">
        <div id="apDiv1"></div>
    </a>
</div>

Answer 1

尝试这个：

<div id="apDiv2">

<a href="#" onclick="this.removeChild(this.firstChild)"><div id="apDiv1">T</div></a>

</div>

• removeChild()只删除一个直接的孩子。

• 我还使代码更简洁：

  • this引用事件的标签本身（在本例中为<a>标签）
  • this.firstChild指向链接标签的第一个孩子：<div id="apDiv1">

顺便说一下，F12下次请在浏览器的开发者控制台中查看（例如在 Chrome 中）。您会看到可以在此处发布的错误。它会帮助人们帮助你；）

---

更好的方法是将 JavaScript 放在它自己的文件中（或至少放在一个块）并使用 ID 来引用元素。

我会给链接另一个 ID，例如myLink：

document.getElementById("myLink").addEventListener("click", function () {
  this.removeChild(this.firstChild);
});

如果您无法为链接标签指定 ID，有多种方法可以使用外部apDiv2作为参考点，例如：

var linkTag = document.querySelector("#apDiv2 a");
// or
var linkTag = document.getElementById("apDiv2").getElementsByTagName("a")[0];