jQuery基础-事件/event.html

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title></title>
    <style>
    .left div {
        width: 500px;
        height: 100px;
        padding: 5px;
        margin: 5px;
        float: left;
        border: 1px solid #ccc;
    }
    
    .left div {
        background: #bbffaa;
    }
    </style>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>

<body>
    <h3>事件委托，通过事件对象区别触发元素</h3>
    <div class="left">
        <div class="aaron">
            <ul>
                <li>点击：触发一</li>
                <li>点击：触发二</li>
                <li>点击：触发三</li>
                <li>点击：触发四</li>
            </ul>
        </div>
    </div>

    <script type="text/javascript">

        //多事件绑定一
        $("ul").on('click','li',function(e){
           alert('触发的元素是内容是: ' + e.target.textContent)
        })


    </script>

</body>
</html>