事件委托简单的来说，事件委托就是利用js事件冒泡的特性，将内层元素的事件委托给外层处理。

什么是事件委托

简单的来说，事件委托就是利用js事件冒泡的特性，将内层元素的事件委托给外层处理。

事件委托的好处

如果要给多个li添加相同的事件，使用事件委托只需要给他们的父级添加事件监听。节约了内存，也节省自己的工作量。

如果某个元素是通过dom后天添加的，那它的事件你是无法去绑定的，这个时候只能用事件委托去处理。

封装事件委托

function on(eventType, element, selector, fn) {
  if (!(element instanceof Element)) {
    element = document.querySelector(element);
  }
  element.addEventListener(eventType, (e) => {
    const t = e.target;
    if (t.matches(selector)) {
      fn(e);
    }
  });
}

注意：

事件委托的实现依靠的冒泡，因此不支持事件冒泡的事件就不适合使用事件委托。

不是所有的事件绑定都适合使用事件委托，不恰当使用反而可能导致不需要绑定事件的元素也被绑定上了事件。