事件捕获的的分析

事件捕获的的分析

<!DOCTYPE html>
<html>
<head>
    <title>event</title>
    <style>
        html,body{
            background: bisque;
        }
    #obj1{
        width: 100%;
        height: 100%;
    }
    #obj2{
        background: salmon;
    }
    #obj3{
        background: skyblue;
    }
    </style>
</head>
<body>
    <div id="obj1">
        <h5 id="obj2">HELLO</h5>
        <h5 id="obj3">WORLD</h5>
    </div>
    <script type="text/javascript">
        var obj1=document.getElementById('obj1');
        var obj2=document.getElementById('obj2');
        var obj3=document.getElementById('obj3');
        obj1.addEventListener('click',function(e){
            alert('最外层的点击');
            var event = window.event || e;
            console.log(event);
        },true);
        obj2.addEventListener('click',function(){
            alert('HELLO 的点击');
        });
        obj3.addEventListener('click',function(){
            alert('WORLD 的点击');
        });
    </script>
</body>
</html>