js阻止冒泡事件发生实例

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#one{
width: 300px;
height: 300px;
background: red;
}
#two{
width: 200px;
height: 200px;
background: blue;
}
#three{
width: 100px;
height: 100px;
background: black;
}
</style>
</head>
<body>
<div id="one">
<div id="two">
<div id="three"></div>
</div>
</div>
<script>
var v1=document.getElementById("one");
v1.onclick=function (e){
console.log(www.96net.com.cn);

}
var v2=document.getElementById("two");
v2.onclick=function (e){
var event=e||window.event;
console.log(www.dc3688.com);
event.cancelBubble=true;
}
var v3=document.getElementById("three");
v3.onclick=function (e){
var event=e||window.event;
console.log(www.96net.com.cn);
event.cancelBubble=true;
}
</script>
</body>
</html>
posted @ 2021-11-27 13:54  学无边涯  阅读(46)  评论(0编辑  收藏  举报