JavaScript dom事件机制

事件绑定方式

  • 直接绑定在DOM
click

-Elenenonclick属性

document.getElementById("xxx").onclick = function(){
    // TODO     
};
  • EventTarget.addEventListener()方法,将指定的监听器注册到 [EventTarget]
document.getElementById("xxx").addEventListener("click",function(e){
      // TODO
});

注意
第二种会把第一种给覆盖掉,也就是说第一种和第二种是属于同一个方式,只是写法不同。

 

执行顺序

  • a标签的href中的代码总是最后执行,最低的优先级。
  • 无论是onclick还是addEventListener的执行顺序是按照 绑定的顺序在执行,就是先绑定的就先执行。
  • 如果onclick事件被重复绑定,则以最后一次的绑定所在的顺序为准。
  • 如果在DOM中直接使用onclick ,并且没有覆盖,则onclick的绑定是早于addEventListener的。
  • 如果绑定多个addEventListener事件,在任意一个事件中stopPropagation(), 都会阻止事件的冒泡,但不会阻止后续事件的执行。

你可能感兴趣的:(JavaScript dom事件机制)