js 事件委托（事件代理） 思路解析

事件委托

简单来说就是 将事件委托给父级处理

默认事件的传播方式是冒泡，即子级产生一个事件会逐级的向父级传播，有响应的响应函数就会被触发。
event 的target属性 可以获得冒泡的首层

基于这两个基本概念，我们可以在父级设置响应函数来处理子级的事件
也就是说我们可以在父级统一管理子级的事件 也就是代理

function changeTag(e) {
  let target = e.target || e.srcElement;
  if (target.tagName.toLowerCase() === "li") {
    let lis = document.querySelectorAll("ul li")
    let index = Array.prototype.indexOf.call(lis, target)
    alert(target.innerHTML + index)
  }
}

这有什么好处呢

可以整合子级相同的事件处理，减少dom操作，提高效率
另外新增的子级不必再添加事件处理