事件委托机制

是什么

事件委托机制就是把事件处理程序委托给父元素或祖先元素来处理，而不是直接把事件处理程序绑定给子元素。

例子

比如说，现在我有一个ul元素，这个元素有许多li子元素，需要给li元素绑定事件，就可以在父元素ul上来绑定事件，通过e.target来判断那个li元素需要执行事件。

优点

使用事件委托可以减少事件处理的数量，只需要在一个元素上绑定事件就能够处理所有子元素的事件，能够减少内存占用和页面加载时间，减少代码量，并且可以让代码更具有维护性。

原理

事件委托机制的实现是基于事件冒泡的。当一个事件被触发时，它会沿着DOM树向上传播，直到它到达文档的根节点。在这个过程中，每个祖先元素都会检查它是否有绑定该事件，如果有，该处理程序就会被执行。

帮助理解的知识点：DOM事件流

捕获阶段

事件从文档的根节点开始向下传播，直到达到事件目标元素的祖先元素。在这个过程中，如果有任何祖先元素有绑定该事件的处理程序，这个处理程序就会被执行。

目标阶段

在目标阶段，事件到达目标元素。如果该元素有绑定该事件的处理程序，这个处理程序就会被执行。

冒泡阶段

在冒泡阶段，事件从目标元素开始向上冒泡直到文档根节点。在这个过程中如果该元素有绑定该事件的处理程序，这个处理程序就会被执行。

顺序

从上到下（捕获阶段），然后从下到上（冒泡阶段）。在事件冒泡阶段中，事件处理程序通常绑定到目标元素或其祖先元素上，以便在事件传播到目标元素时被调用。