<html onclick="fn(4)">
<head>
<meta charset="utf-8">
<title>事件冒泡</title>
<style type="text/css">
#box {
background: coral;
width: 200px;
height: 200px;
margin: 0px auto;
}
#sub {
background: cornflowerblue;
width: 100px;
height: 100px;
}
</style>
</head>
<body onclick="fn(3)">
<div id="box" onclick="fn(2)">
<div id="sub" onclick="fn(1)">
</div>
</div>
<script type="text/javascript">
function fn(n) {
switch (n) {
case 1:
alert("children");
break;
case 2:
alert("parent");
break;
case 3:
alert("body");
break;
case 4:
alert("html");
break;
}
}
</script>
</body>
</html>