js去除事件的方式

对于传统方式,我们可以使用onclick = null;
新方式,使用removeEventListener
注:使用removeEventListener时参数必须和addEventListener相同,因此使用匿名函数作为回调函数时,删除事件是不生效的。

<body>
    <div id="id1">
        点击我
    </div>

    <div id="id2" style="margin-top: 50px;">
        点击我2
    </div>

    <script>
        let div1 = document.querySelector('#id1');
        let div2 = document.querySelector('#id2');
        // 传统方式
        div1.onclick = function () {
            alert('我只能出现一次');
            div1.onclick = null;    // 删除事件
        }

        // 新方式
        div2.addEventListener('click', fn);
        function fn () {
            alert('我也只能出现一次');
            div2.removeEventListener('click', fn);      //去除事件
        }
    </script>
</body>

你可能感兴趣的:(js,javascript,前端,开发语言)