事件周期:捕获=＞目标触发=＞冒泡

***事件周期: 
   DOM标准: 3阶段
      1. 捕获(capture): 由外向内依次记录各级元素绑定的相同事件处理函数
      2. 目标触发: 执行实际触发事件的元素上的处理函数
      3. 冒泡: 由目标元素向外，出发各级父元素上绑定的相同事件处理函数
        目标元素(target): 实际触发事件的元素     

   IE8: 2个阶段: 没有捕获阶段   

   事件对象: event: 在事件发生时，自动创建的封装所有事件信息的对象
       event对象提供了操控事件的方法: 阻止事件, 取消冒泡....
   何时: 1. 为了获得事件相关的数据
            2. 操控事件
   如何: 
      获取: DOM标准: 事件对象，默认作为事件处理函数的第一个参数传入: 
               IE8: 事件对象自动保存在全局变量event中
         兼容: function eventHandler(e){
         e=e||window.event;
                  }
      
   取消冒泡: e.stopPropagation();
   利用冒泡: 
   优化: 尽量少的添加EventListener
       为什么: 每个EventListener都是一个对象
          浏览器触发事件时，会轮询每个EventListener对象
          添加的EventListener越多，页面响应速度越低
   解决: 当多个平级子元素绑定相同的事件处理函数时
           其实，只要在父元素绑定一次，所有子元素共用即可！
   难题: 1. 如何获得目标元素:
              this->父元素 X
              DOM: e.target ->目标元素
              IE8: e.srcElement
                  兼容: var target=e.target||e.srcElement;
            2. 鉴别目标元素是否想要: 
              判断元素的名称或属性