<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>事件流</title>
</head>
<body>
<div id="box">
<input type="button" value="按钮" id="btn" onclick="show()">
<input type="button" value="按钮2" id="btn2" >
<input type="button" value="按钮3" id="btn3" >
</div>
<script>
//使用Html事件处理程序
function show()
{
alert("hello");
}
//使用DOM0级事件处理程序
function show2(){
alert("使用DOM0级事件处理程序");
alert(this.value);
}
/*var b2;
b2 = document.getElementById("btn2");
b2.onclick=show2();
//使用DOM2级事件处理程序 第一个参数中开头的ON 去掉
var b3;
b3 = document.getElementById("btn3");
b3.addEventListener('click',show2,false);*/
/* b2 = document.getElementById("btn2");
//IE中添加DOM2级事件处理程序
b2.attachEvent('onclick',show2);
b2.detachEvent('onclick',show2);*/
var EventUtil= {
addHandler: function (element, type, handler) {
if (element.addEventListener()) {
element.addEventListener(type, handler, false);
} else if (element.attachEvent()) {
element.attachEvent('on' + type, handler);
} else {
element['on' + type] = handler;
}
},
//删除句柄
deleteHandler: function (element, type, handler) {
if (element.removeEventListener()) {
element.removeEventListener(type, handler, false);
} else if (element.detachEvent()) {
element.detachEvent('on' + type, handler);
} else {
element['on' + type] = null;
}
}
}
var btn3=document.getElementById("btn3");
EventUtil.addEventListener(btn3,'click',show2());
</script>
</body>
</html>