第一种

把事件写在标签的属性里，如：

<a href="#" onclick="t()">

这是DOM 0级的标准（非常古老的标准）。

1. 好处：大家都会，几乎所有浏览器都支持
2. 坏处：夹杂在HTML代码中，不简洁，这种事件写法，效率不高，不符合“行为、结构、样式相分离”

第二种

用事件属性来绑定事件函数

1. 好处：完成了行为的分离，便于操作当事对象，因为function是作为对象的onxxx属性出现的，因此，函数里操作该对象，直接用this就能引用当事对象可以方便地读取“事件对象”。
2. 坏处：多人团队开发时，相同的事件，后面的会覆盖前面的。

第三种

w3c中的标准 addEventListener

1.绑在哪个事件上？ click,load,change,blur,focus,mouseover,mouseup...等等

2.绑定什么函数---自定义事件函数

3.什么方式监听执行事件函数？捕捉，冒泡？

语法：xxxDomObject.addEventListener();

注意：

1. 事件名一律不带on
2. 绑定事件函数中的"this"指绑定该事件的对象
3. 执行顺序是按绑定顺序执行的

捕捉模型与冒泡模型

外 -> 内，称为捕捉模型

内 -> 外，称为冒泡模型

总结：

1. 第三个参数true/false 代表 捕捉/冒泡模型，如果不填，默认为false（建议不省略）。
2. 系统会为事件函数自动传入事件对象，作为第一个参数传入