解除事件绑定的方法

2021-04-27 18:30:51 阅读：180 来源： 互联网

标签：function console log 绑定 addEventListener 解除事件 divClick click

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style type="text/css">
        div {
            width:100px;
            height: 100px;
            background-color: #f00;
        }
    </style>
</head>
<body>
    <div id="the-d"></div>
    <script type="text/javascript">
    //解绑定事件的三种方法
    //1  ontType 
    var d=document.querySelector('#the-d'); 

    // d.οnclick=function(){
    //     console.log('我被点击了，clcik');
    //     console.log(this);
    // }

    // d.οnclick=null;


    //2 removeEventListener('type' function)
    // function divClick(){
    //     console.log('我被点击了，click');
    // }

    // function divClick1(){
    //     console.log('我被点击了，click');
    // }

    // function divClick2(){
    //     console.log('我被点击了，click');
    // }

    // d.addEventListener('click',divClick);
    // d.addEventListener('click',divClick1);
    // d.addEventListener('click',divClick2);
   
    // d.removeEventListener('click',divClick);

    //1 removeEventListener 只能删除 addEventListener 加上去
    //2  删除时，必须有函数，如果你不知道函数，Js途径没有办法查询，更无法删除
    //3 作为程序员，怎么能够知道某一个元素挂上了那些事情？
    
    //3 deattachEvent('onType',function)
    function divClick(){
        console.log('被点击了');
    }

    d.attachEvent('onclick',divClick);

    d.detachEvent('onclick',divClick);

    // 练习，按照，addEvent写一个removeEvent，同时要兼容IE和chrome 
    </script>
</body>
</html>

标签：function,console,log,绑定,addEventListener,解除,事件,divClick,click
来源： https://blog.csdn.net/qq_45716607/article/details/116207098

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

解除事件绑定的方法