带你深入理解事件触发，事件捕获和事件冒泡

一.事件对象

事件触发时自动创建的，封装了事件发生的元素和属性信息
var obj = document.getElementById("dome2") 
obj.addEventListener("click",function(e){
    //e就是事件对象。不传入e可以通过window.event也可以获取 arguments[0] 
},false)  //true:捕获 false:冒泡 

二.事件周期

事件捕获、事件对象的触发、冒泡触发
事件捕获：当点击元素时会从最外面开始往里找，直到找到点击的元素
再是事件对象的触发
冒泡触发：当找到点击的元素后执行了点击事件，会逐级往上找有点击事件的父元素，执行父元素的点击事件
阻止冒泡的方法：e.stopPropagation()
冒泡的用处：可以用来做事件委托
事件委托：
    <ul id="ul">
        <li>123</li>
        <li>234</li>
    </ul>
    如果我要给每个li绑定点击事件输出内容，就可以使用冒泡在父元素上添加点击事件
    var ul = document.getElementById("ul");
    ul.addEventListener("click",function(e){
        if(e.target.nodeName.toLowerCase()==="li"){
            alert(e.target.innerHTML)
        }
    })

三.常用阻止默认行为的两种方式

如默认事件阻止：
    <a href="http://www.baidu.com">百度</a> 
    var a = document.querySelector('a');
    a.onclick = function(e){
        //e.stopPropagation()  或
        //return false
    }
    就不会跳转