JS事件冒泡 - 叨叨宅

恰饭广告

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        .one_box{
            width: 400px;
            height: 360px;
            border: 1px solid black;
            margin: auto;
            padding: 50px;
            background: blue;
        }
        .two_box{
            width: 200px;
            height: 200px;
            border: 1px solid black;
            margin: auto;
            padding: 75px;
            background: green;
        }
        .three_box{
            width: 100px;
            height: 100px;
            border: 1px solid black;
            padding: 50px;
            background: red;
      }
 </style>
</head>
<body>
    <script type="text/javascript">
    function Outside(){
       alert("这是外部的div");
    }
    function Midddle(){
         alert("这是中间的div");
    }
    function Inside(){
         alert("这是内部的div");
    }
    </script>
    <div class="one_box" onclick="Outside()">
        <div class="two_box" onclick="Midddle()">
            <div class="three_box" onclick="Inside()"> </div>
        </div>
    </div>
</body>
</html>

注意：事件捕获就不写了，事件捕获IE是不支持的，而且几乎不可能用到

原文链接：https://www.idaobin.com/archives/220.html

让我恰个饭吧.ヘ(￣ω￣ヘ)

支付宝 ——————- 微信