Javascript 事件委派：影响的元素比应该的多

我正在学习事件授权，我遇到了一个问题

起初，当我写第一稿时，如果我在中单击，它只会删除文本而不会删除按钮，所以我修改了它。后来，当单击container div时，它删除了整个内容，所以我再次更改了它

现在它是功能性的，但在我看来，它可以更通用地编写（无需添加类名，只需添加容器的id），并且以更高效的方式编写，我觉得代码比它应该的多得多

还有一件事：它应该与动态添加的元素一起工作

任何帮助都将不胜感激

函数getTarget（e）{
返回e.target；
}
功能删除（e）{
var目标=getTarget（e）；
target.parentNode.removeChild（目标）；
}
功能移除1（e）{
var目标=getTarget（e）；
var parent=target.parentNode；
parent.parentNode.removeChild（父级）；
}
document.getElementById（“contendor”）.addEventListener（“单击”，函数（e）{
if（e.target&&e.target.nodeName===“DIV”&&e.target.classList.contains（“bot”））{
删除（e）；
}
if（e.target&&e.target.nodeName==“SPAN”）{
删除1（e）；
}
document.getElementById（“parrafo”）.textContent=“单击鼠标右键”；
});

asdasd


asdasd


asdasd


asdasd


asdasd


asdasd


在JS事件中，
e.target
是执行操作（单击）的元素，
此
是代码附加到的元素。这可用于检查parentNode是否是单击所附加到的div（通过id检查parentNode是否是div也可以做到这一点，但由于这是一个事件委派练习，
这更有趣：）

}))


作为旁注，除了在每个div下添加一个

之外，您还可以通过css使用以下内容更改边距

.bot{
    margin-bottom:20px;
}

这样做的好处是，删除的元素保留相同的空间（当然，除非并非出于此目的；）

示例：
谢谢！这就是我一直在寻找的：）非常简单，工程伟大！
.bot{
    margin-bottom:20px;
}