事件处理程序和监听器和事件冒泡和事件捕获
我对JavaScript中的“Event Listener”，“Event Handler”，“Event Bubbling”和“Event Capturing”感到困惑。
我在互联网上搜索并查看了不同的网站但是，我仍然有一些问题了解一些差异甚至基本情况。
正如本文所述 ，创建事件处理程序并侦听事件。
- 这是否意味着，附加到DOM内部元素的JavaScript函数不是事件处理程序，它们是事件监听器？
此外， 在这里我发现了“事件冒泡”和“事件捕获”之间的区别。 此外，我前段时间已经读过，在dojo中，所有事件都被标记捕获。
-
是否意味着DOM中的其余元素没有附加JavaScript？
-
更准确地说，如果一个事件将由父母通过“事件冒泡”处理，那么就没有必要为孩子们添加听众吗？
这些术语背后的确切定义是什么？
事件处理程序/事件监听器
事件监听器和事件处理程序之间没有区别 – 出于所有实际目的，它们是相同的。 但是，以不同方式思考它们可能会有所帮助：
我可以定义一个“处理程序”……
function myHandler( e ){ alert('Event handled'); }
…并使用’addEventListener’将其附加到多个元素：
elementA.addEventListener( 'click', myHandler ); elementB.addEventListener( 'click', myHandler, true );
或者，我可以将“处理程序”定义为“addEventListener”中的闭包：
elementC.addEventListener( 'click', function( e ){ alert('Event Handled'); } );
事件捕获/事件冒泡
您可以将事件捕获视为事件冒泡的反面 – 或者事件生命周期的两半。 DOM元素可以嵌套（当然）。 事件首先从最外层父项到最内层子项进行CAPTURES ，然后从最里面的子项到最外层的父项进行BUBBLES 。
您可能已经注意到，在上面的示例中，附加到elementB的侦听器有一个附加参数 – true – 不会传递给elementA。 这告诉侦听器在CAPTURE阶段响应事件，而默认情况下它将响应BUBBLE阶段。 在jsfiddle.net上试试这个：
假设我们有3个嵌套的div元素：
1 2 3
…我们为每个附加一个’click’处理程序：
document.getElementById('one').addEventListener( 'click', function(){ alert('ONE'); } ); document.getElementById('two').addEventListener( 'click', function(){ alert('TWO'); }, true ); document.getElementById('three').addEventListener( 'click', function(){ alert('THREE') } );
如果单击“1”，您将看到一个带有“ONE”文本的警告框。
如果单击“2”，您将看到一个警告框“TWO”，然后是一个警告框“ONE”（因为“两个”在捕获阶段中首先被触发，并且在返回的路上触发“一个”在泡泡阶段 ）
如果单击“3”，您将看到一个警告框“TWO”（ CAPTURED ），然后是一个警告框“THREE”（ BUBBLED ），然后是一个警告框“ONE”（ BUBBLED ）。
清楚如泥，对吗？