js事件冒泡

事件冒泡:事件发生时,事件发生的元素的祖先元素也可以被触发该事件

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <ul>
        <li>li的内容 <span>span内容</span></li>
    </ul>
    <script>
        var ul = document.getElementsByTagName('ul')[0];
        var li = document.getElementsByTagName('li')[0];
        var span = document.getElementsByTagName('span')[0];
        span.onclick = function () {
            console.log('触发span的点击事件!');
            /*触发span的点击事件!
            触发li的点击事件!
            触发ul的点击事件!*/
        };
        li.onclick = function () {
            console.log('触发li的点击事件!');
            /*触发li的点击事件!
             触发ul的点击事件!*/
        };
        ul.onclick = function () {
            console.log('触发ul的点击事件!');
//            触发ul的点击事件!
        }
    </script>
</body>
</html>
阅读更多
个人分类: javascript
上一篇事件委托
下一篇js倒计时
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭