Document
.box1{
height: 500px;
width:500px;
background:red;
}
.box2{
height: 300px;
width:300px;
background:green;
}
.box3{
height: 100px;
width:100px;
background:blue;
}
window.onload = function(){
var box1 = document.getElementsByClassName('box1')[0]
var box2 = document.getElementsByClassName('box2')[0]
var box3 = document.getElementsByClassName('box3')[0]
box1.onclick = function(e){
console.log('单击了红色的');
}
box2.onclick= function(){
console.log('单击了绿色');
}
box3.onclick=function(e){
//如果提供了事件对象，则这是一个非IE浏览器
if(e&e.stopPropagation)
//W3C的方法
e.stopPropagation();
else
//这是IE的方式
window.event.cancelBubble = true;
console.log('单击了蓝色的');
}
}
