1.给dom元素绑定事件
<div id="box"></div>
2.简单设置一下样式
#box{
width: 100px;
height: 100px;
background-color: deepskyblue;
}
3.通过js绑定事件,后面的事件会覆盖前面的事件
var box=document.getElementById("box");
box.onclick=function(){ // 不执行
alert(1);
}
box.onclick=function(){ // 执行
alert(2);
}
4.通过jquery绑定事件,会按照顺序执行
$("#box").click(function(){ // 执行弹出1
alert(1);
})
$("#box").click(function(){ // 执行弹出2
alert(2);
})
5.通过addEvenetListener绑定事件,按照代码顺序执行
var box=document.getElementById("box");
box.addEventListener('click',function(){alert(1)},false) // 弹出1
box.addEventListener('click',function(){alert(2)},false) // 弹出2
box.addEventListener('click',function(){alert(3)},true) // 弹出3
// addEventListener的第三个参数代表的是事件执行的时机,true代表在捕获阶段执行,false代表是在冒泡阶段执行,默认是false