事件流
当你点击一组同心圆的圆心,你实际上点击了所有的圆,而不仅仅是最小的圆。
事件流
1)冒泡流 - 由嵌套最底层向上传播
2)捕获流 - 由顶层向下传播(较少使用)
DOM 事件流:DOM 2级事件规定事件流分为三个阶段:事件捕获、处于目标以及事件冒泡阶段。
事件捕获从上向下传播,为事件截获提供了机会,冒泡阶段中元素对事件作出响应。
事件对象
事件被触发时,会产生一个包含该事件相关信息的事件对象。
event.target/currentTarget/this 的关系。
事件处理的内存和性能
事件委托
单独为每个元素添加事件处理程序会占用大量内存(每个函数都是一个对象),应用事件委托,只添加少量事件处理程序,利用冒泡流和 target 属性对不同元素触发执行不同的代码,可以使得内存消耗更低。(比较适合用于键盘、鼠标的事件触发)
移除元素前先移除其链接的事件处理程序
参考文献:
《JavaScript 高级程序设计》第 13 章 事件