addEventListener和onclick

普通的onclick事件
普通的onclick就是直接触发事件，并且在同一时间指向唯一的对象 ，如果对一个对象多次绑定,会直接被覆盖只会显示最后一个绑定的事件。

var btn = document.getElementById('demo')
btn.onclick = function (){
	alert('hello click')
}
btn.onclick = function (){
	alert('hello world')
}
//.....result：hello world

addEventListener事件
对于一个事件对象，进行多次绑定事件，都能够运行，不会发生覆盖的情况

var btn = document.getElementById('demo')
btn.addEventListener('click',function(){
	alert('hello addEventListener')
},false)
btn.addEventListener('click',function(){
	alert('hello world')
},false)
//弹框会依次弹出 hello addEventListener 和 hello world

addEventListener的参数问题

1. 参数1：事件类型名称（string）
2. 参数2：要触发的事件处理程序函数（function）
3. 参数3：true表示在捕获过程中执行，false表示在冒泡过程中执行处理函数

二者的区别

• addEventListener对任何的DOM都有效，而onclick仅限于HTML
• addEventListener可以控制事件触发的阶段（捕获/冒泡），对于同一事件注册多个监听器，不会发生覆盖