1、DOM0级事件
a:写在标签内的onclick事件都是DOM0级事件
b:获取元素,绑定onclick等事件也是DOM0级事件
eg:
<div id="myBtn" class="click" onclick="alert('我是dom0级标签内事件')"></div>
<div id="myBtn2" class="clcik"></div>
document.getElementById("myBtn2").onclick = function{
alert("我是dom0级获取元素绑定事件")
}
DOM0级的绑定两个事件时,第二个会把第一个覆盖掉
2、DOM2级事件(只有DOM2级事件有三个阶段:事件捕获阶段,处于目标阶段,事件冒泡阶段)
只有一个:监听方法,有添加和移除的事件处理程序:addEventListener()和removeEventListener
有三个参数:第一个参数是事件名(如click)
第二个参数是事件处理程序函数
第三个参数如果是true表示捕获阶段调用,如果是false表示冒泡阶段调用
document.getElementById("myTest").attachEvent("onclick", function(){alert(1)});
//等价于document.getElementById("myTest").addEventListener("click", function(){alert(1)}, false);
eg:
<span>
<a></a>
</span>
点击a后capturing(捕捉)阶段事件传播会从document-> span->a,然后发生在a,最后bubbling(冒泡)阶段事件传播会从a->span->document 。