事件捕获和冒泡

事件冒泡.png

问题的产生

事件.png

同一事件在不同元素之间出现重叠 如何处理事件发生的顺序

问题的解决

在w3c的事件模型中，会首先捕获直到目标元素，然后再一路往上级冒泡到顶层。

也就是先从最外层到最里层查询注册在捕获阶段触发事件 , 然后从最里层到最外层进行查询注册了冒泡阶段触发的事件

注册不同阶段的事件

element1.addEventListener('click',doSomething2,true)
element2.addEventListener('click',doSomething,false)

阻止事件传递

兼容所有浏览器

function doSomething(e){    
  if (!e) var e = window.event;    
  e.cancelBubble = true;    
  if (e.stopPropagation) e.stopPropagation();
}

获取事件发生的元素

    
        
        
        
    
    
        
father
            

                son