Event

Event FlowEvent Handlerevent对象内存和性能 事件是用户和浏览器交互的产物，HTML事件可以触发执行一段JS代码。观察者模式。

Event Flow

3个阶段：捕获阶段，目标阶段，和冒泡阶段。 .addEventListener(type, func, true/false), true是捕获上到下，false是冒泡下到上。

Event Handler

HTML Event Handler:

DOM 0 Event Handler: let btn = document.getElementById(“btn”) btn.onclick = ()=>{console.log(btn.value)}

DOM 2 Event Handler: btn.addEventListener(type, func, true/false) 可控捕获/冒泡。多个事件监听器可以被接上。 btn.removeEventListener(type, func. true/false)

event对象

常见的event.type, target/currentTarget, preventDefault. target表示event注册的对象，currentTarget是时间循环里event触发的对象。

内存和性能

减少event handler数量：同类的event handler可以合并成一个，放在子dom树的根部。 删除node的同时手动删除和node联系的event handler，eg. btn.onclick = null。

*测试event handler： 有时候你想用js模拟用户动作，你可以用UIEvents, MouseEvents, HTMLEvents等类来实现。测试的时候比较省心。