Order 事件顺序
点击不同颜色盒子, 盒子上的绑定事件如果被执行, 盒子会显示数字,
不同数字代表事件调用顺序. 点击按钮设置事件的第三个参数useCapture,
指定事件是否在捕获或冒泡阶段执行, 来改变事件的调用顺序.
来测试下和预期的数字是否一致.
盒子上事件函数执行的总次数:0
点击
addEventListener('click', fn, false)
点击
addEventListener('click', fn, false)
点击
addEventListener('click', fn, false)
事件委托/代理 Delegation
阻止传播 stopPropagation
很多场景会用到, 点击选框以外任何地方, 都会关闭打开状态下的选框,
整个body都会绑定关闭事件, 利用事件的冒泡机制, 选框以内被点击时, 设置阻止传播,
body的关闭就不会被调用
阻止传播 stopPropagation