<!DOCTYPE html>
<html>
<head>
<title>event</title>
<style>
html,body{
background: bisque;
}
#obj1{
width: 100%;
height: 100%;
}
#obj2{
background: salmon;
}
#obj3{
background: skyblue;
}
</style>
</head>
<body>
<div id="obj1">
<h5 id="obj2">HELLO</h5>
<h5 id="obj3">WORLD</h5>
</div>
<script type="text/javascript">
var obj1=document.getElementById('obj1');
var obj2=document.getElementById('obj2');
var obj3=document.getElementById('obj3');
obj1.addEventListener('click',function(e){
alert('最外层的点击');
var event = window.event || e;
console.log(event);
},true);
obj2.addEventListener('click',function(){
alert('HELLO 的点击');
});
obj3.addEventListener('click',function(){
alert('WORLD 的点击');
});
</script>
</body>
</html>