码迷,mamicode.com
首页 > 其他好文 > 详细

阻止冒泡的两种方式 事件委托

时间:2020-06-06 15:39:02      阅读:100      评论:0      收藏:0      [点我收藏+]

标签:doctype   opp   device   type   ima   事件委托   mamicode   style   rop   

技术图片

 

 

 // e.stopPropagation();  // 阻止冒泡
            e.cancelBubble = true; // 取消冒泡
 
 
 
 
技术图片

 

 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <ul>
        <li>知否知否</li>
        <li>知否知否</li>
        <li>知否知否</li>
        <li>知否知否</li>
        <li>知否知否</li>
        <li>知否知否</li>
    </ul>

    <script>
        var ul = document.querySelector(‘ul‘);
        ul.addEventListener(‘click‘, function(e) {
            // e.target 可以得到点击的对象
            e.target.style.backgroundColor = ‘pink‘;

        })
    </script>
</body>

</html>
 
 

阻止冒泡的两种方式 事件委托

标签:doctype   opp   device   type   ima   事件委托   mamicode   style   rop   

原文地址:https://www.cnblogs.com/ericblog1992/p/13054856.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!