<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#div1{
background-color: #2b99ff;
height: 400px;
width: 500px;
}
#div2{
background-color: #e59373;
height: 170px;
width: 180px;
}
</style>
</head>
<body>
<div id="div1" onclick="func1()">
<div id="div2" onclick="func2(event)"></div>
</div>
<script>
function func1() {
alert("div1");
}
function func2(e) {
alert("div2");
e.stopPropagation(); // 此图形因为div2标签是嵌套在DIV1里的 如果点击div2区域触发事件,也同事会触发div1的区域事件,
// 用stopPropagation 来阻止事件的传播 此时点击div2 只有div2弹出
}
</script>
</body>
</html>
