<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>事件綁定與監聽的區別</title>
</head>
<body>
<button id="btnA">按鈕A</button>
<button id="btnB">按鈕B</button>
<script type="text/javascript">
var btnA = document.getElementById("btnA");
var btnB = document.getElementById("btnB");
btnA.onclick = function() {
alert("你點了一下");
}
btnA.onclick = function() {
alert("你又點了一下");
}
btnB.addEventListener("click",function(event){
alert("你點了一下");
},false);
btnB.addEventListener("click",function(event){
alert("你又點了一下");
},false);
</script>
</body>
</html>
使用on事件名的形式綁定事件后綁定會覆蓋前面綁定的事件，也就是最后一個綁定的事件會生效；
使用addEventListener綁定事件則不會覆蓋，可同時在一個元素上綁定多個相同的事件。