DOM题集

1.DOM事件模型是什么？

1. 捕获
2. 冒泡
3. 如果这个元素是被点击的元素，那么不一定先捕获后冒泡，顺序是由监听顺序决定的

2. 移动端的触摸事件了解吗？

1. touchstart touchmove touchend touchcancel
2. 模拟swipe事件：记录两次移动的位置，如果后一次在前一次的右边，那么就是向右滑动。

3. 事件委托是什么？有什么好处？

1. 事件委托，通俗地来讲，就是把一个元素响应事件（click、keydown......）的函数委托到另一个元素。
   假设父元素有4个儿子，我不监听4个儿子，而是监听父元素，看触发事件的元素是哪个儿子，这就是事件委托。
2. 可以监听还没出生的儿子，同时也省监听器。

function listen(element, eventType, selector, fn){
  element.addEventListener(eventType, (e)=>{
    let el = e.target
    if( el.matches(selector) ){
      fn.call(el, e, el)
    }
  })
}
//有bug，但是可以通过事件委托普通面试的代码

function listen(element, eventType, selector, fn){
  element.addEventListener(eventType, (e)=>{
    let el = e.target
    while(! el.matches(selector) ){
      if(element === el){
        el = null
        break;
      }
      el = el.parentNode
    }
    el && fn.call(el, e, el)
  })
  return element
}
//工资12k的前端写的事件委托