Dol*_*Dol 5 javascript addeventlistener event-bubbling event-delegation dom-events
我\xe2\x80\x99m 学习事件如何工作，主要是事件捕获和冒泡addEventListener。这篇文章对于整体理解很有帮助。
捕获和冒泡定义父元素中事件发生的顺序。据我了解，由于事件委托，这很重要。\xe2\x80\x99t实际上addEventListener不会为您委托事件，它只是搜索委托事件，这是正确的吗？
除了事件委托之外，还有其他原因需要搜索 DOM 层次结构吗？
\n\n当我将事件附加DOM level 1 onclick到父元素并单击其子元素之一时，我仍然将子元素作为事件获取target。因此，我不认为将事件侦听器附加到子元素然后冒泡以搜索委托元素有什么意义。我这里一定缺少什么东西..
当然，如果您手动维护委托事件，则无需在 DOM 层次结构中向上搜索委托事件？
\n\n\n\n\xe2\x80\x99t实际上
\naddEventListener不会为您委托事件，它只是搜索委托事件，这是正确的吗？
不会。它对事件委托完全没有任何作用，但可以用作事件委托的一部分。该addEventListener方法向 DOM 节点添加一个事件侦听器，该事件侦听器在事件向上冒泡或向下传播到该元素时做出响应。
事件委托是将事件处理程序添加到 HTML 标记容器的组合，通过addEventListener该事件处理程序响应其中元素的冒泡事件。
\n\n\n当我将
\nDOM level 1 onclick事件附加到父元素并单击其子元素之一时，我仍然将子元素作为事件目标。因此，我不认为将事件侦听器附加到子元素然后冒泡以搜索委托元素有什么意义。这里一定有什么东西是我遗漏的
事件委托之所以有益，主要有以下三个原因：
\n\n多尔说：
\n\n\n\n\n但我当然应该通过将 DOM 级别 1 onclick 附加到元素父级（如我所描述的）而不是元素来获得事件委托的好处，而不需要使用 addEventListener 或必须在元素父节点中搜索委托事件？
\n
是否将处理程序附加到事件目标的父级是无关紧要的。如果您希望执行 JavaScript 函数来响应用户事件，则需要使用addEventListener. 事情就是这样完成的。
这里真正的问题似乎是：
\n\naddEventListener“使用事件委托onclick="someFunction()有什么好处？element.onclick = function() {...}
以下 StackOverflow 问题提供了有关addEventListener 与 onclick的一般建议。
\n\n关于事件委托，实际上可以归结为这一点。如果其他一些 JavaScript 代码需要响应单击事件，则使用 addEventListener 可确保双方都可以响应它。如果你们都尝试使用onclick，那么一个就会踩到另一个。如果您想在同一元素上单击，则双方都无法响应。此外，您希望尽可能将您的行为与 HTML 分开，以防以后需要更改它。如果要更新 50 个 HTML 文件而不是一个 JavaScript 文件，那就太糟糕了。
如果您使用该document.documentElement对象附加事件处理程序，则无需等待“domready”事件或页面加载事件来附加委托事件。document.documentElement代表元素的，在<html>JavaScript 开始在页面上执行时就可用于 JavaScript。