事件处理、DOM0级、DOM2级

HTML事件处理

直接添加到HTML结构中

<button id="btn" onclick="demo"></button>
<script>
	function demo(){
		alert("事件处理")；
		}
</script>

DOM 0级事件处理
把一个函数赋值给一个事件处理程序属性

<button id="btn" ></button>
<script>
	var  btn = document.getElementById("btn");
	btn.onclick = function(){
		alert("事件处理");
		}
	btn.onclick = function(){
		alert("覆盖"）;
		｝	
</script>

使用这种方法，事件触发行为之间会发生覆盖，运行结果只会弹出“覆盖”，而“事件处理被覆盖掉”。

DOM 2级事件处理
使用addEventListener（“事件名”，”事件处理函数“，布尔值）、removeEventListener（“事件名”，”事件处理函数“，布尔值）方法来对事件进行绑定与解绑。
true：事件捕获
false：事件冒泡
默认值为false；

<button id="btn" ></button>
<script>
	var  btn = document.getElementById("btn");
	btn.addEventListener("click",demo)
	btn.addEventListener("click",demo2)
	function demo1(){
		alert("事件处理")；
		}	
	function demo2(){
		alert("DOM 2级事件处理")；
		}	
</script>

使用这种方法进行绑定，事件行为之间不会相互覆盖，运行结果为在浏览器端先弹出“事件处理”，然后弹出“DOM 2级事件处理”。

IE事件处理程序
此方法针对IE8及其以下版本
attachEvent（）
detachEvent（）
以上两个方法的使用与addEventListener、removeEventListener相同。