《addEventelistener那些事情》

本篇总结的是addEventListener的后两个参数。

• listener（处理事件）
• useCapture（先处理标志）

顺带提到callee和stopPropagation这两个东西。

• callee（引用当前执行的函数）
• stopPropagation （停止事件传播）

 

listener

listener用来具体处理被触发的事件。可以是一个对象，也可以是一个function。

• 如果是对象，必须要有一个handleEvent方法。{handleEvent:function(event){}}　　
• 如果是funciton，可以是普通函数或是是一个匿名函数。
  • addEventListener("click",handle)
  • addEventListener("click",function(){})

自问自答1：对象做参数和funciton做参数，有什么区别？ 处理方法/函数的上下文会不同

自问自答2：匿名函数做参数如何回收？一次性的情况，可以使用arguments.callee，它是当前执行方法的引用

 

useCapture

userCapture其实是个“先处理标志”。默认是false。

从标准来说事件处理有三个阶段：Caputure，Target，Bubbing。

所以一旦被设置成true，就会先于其他默认的被执行。

在这种场景，通常是做判断，如果符合某个条件的还会使用event.stopPropagation()。

这样就会阻止Target和Bubbing阶段，即子元素的事件处理

 

 

参考

http://www.w3.org/TR/DOM-Level-3-Events/#event-flow

https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope/arguments/callee

https://developer.mozilla.org/en/DOM/event.stopPropagation

https://developer.mozilla.org/en/DOM/element.addEventListener