冒泡现象:触发某元素的某个时间触发其父级元素的对应时间，从元素本身向上冒泡到Dom顶层
<body>
<div id="div1">
<div id="div2">
<div id="div3"></div>
</div>
</div>
<script>
/* 冒泡现象——点击里面的div :会触发里面div的点击事件和其父级的点击事件*/
window.onload=function(){
var div1=document.getElementById("div1");
var div2=document.getElementById("div2");
var div3=document.getElementById("div3");
div1.onclick=function(){
alert(1)
}
div2.onclick=function(){
alert(2)
}
div3.onclick=function(){
alert(3)
}
}
</script>
</body>
阻止事件冒泡
<script>
/* 冒泡现象——点击里面的div :会触发里面div的点击事件和其父级的点击事件*/
window.onload=function(){
var div1=document.getElementById("div1");
var div2=document.getElementById("div2");
var div3=document.getElementById("div3");
div1.onclick=function( ){
alert(1)
}
div2.onclick=function(){
alert(2)
}
div3.onclick=function(ev){
alert(3)
var ev =event||window.event ;
//阻止冒泡
ev.stopPropagation();
/* ev.cancelBubble = true; */
}
}
</script>
时间： 2024-11-10 18:01:05