<!doctype html>
<html>
<head>
<title></title>
<meta charset = "utf-8"/>
</head>
<style type="text/css">
#grandpa{width:300px;height:300px;background:green;}
#father{width:200px;height:200px;background:gray;}
#self{width:100px;height:100px;background:pink;}
</style>
<script type="text/javascript">
function self(evt){
alert("我被打击了")
if(event&&event.stopPropagation){//非IE
event.stopPropagation();
}else{//IE
window.event.cancelBubble=true;
}
}
function father(){
alert("爸爸被打击了")
}
function grandpa(){
alert("爷爷被打击了")
}
</script>
<body>
<div id="grandpa" onclick="grandpa()">
<div id="father" onclick="father()">
<div id="self" onclick="self()">
我是最内层的哦；
</div>
</div>
</div>
</body>
</html>
原文：http://www.cnblogs.com/ahu666/p/6838663.html