addeventlistener所有事件（js如何清除所有绑定的事件）

：暂无数据 2026-09-19 18:00:01 ：0

本篇文章给大家谈谈addeventlistener所有事件，以及js如何清除所有绑定的事件对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。

本文目录

js如何清除所有绑定的事件
js 判断是否存有事件 addeventlistener
window.addeventlistener怎么用

js如何清除所有绑定的事件

1.addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作；

2.所有的DOM节点中都包含这两种方法，并且它们都接受3个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。最有这个布尔值参数是true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用事件处理程序；

3.由于IE只支持事件冒泡，所以同大多数情况下，都是将事件处理程序添加到事件流的冒泡阶段，这样可以最大限度地兼容各种浏览器；

最好只在需要在是事件到达目标之前截获它的时候将事件处理程序添加到捕获阶段。如果不是特别需要，不建议在事件捕获阶段注册事件处理程序。

js 判断是否存有事件 addeventlistener

原生实现无法判断是否有事件。如果确实需要请参照以下代码，另外本代码只使用于调用dom2形式加载或者移除事件功能，对应dom0类型的没有做测试。

以下代码修改了原生的Element对象，是否需要这样做，请自己酌情处理。

《!DOCTYPE html》
《html》
《head lang="en"》
    《meta charset="UTF-8"》
    《title》《/title》
    《script type="text/javascript"》
        /**
         * 此处代码必须放到任何javascript代码之前。另外增加事件只能用addEventListener形式。
         */
        (function() {
            Element.prototype.eventListenerList = {};
            Element.prototype._addEventListener = Element.prototype.addEventListener;
            Element.prototype._removeEventListener = Element.prototype.removeEventListener;
            Element.prototype.addEventListener = function(a,b,c) {
                this._addEventListener(a,b,c);
                if(!this.eventListenerList;
                this.eventListenerList.push(b);
            };
            Element.prototype.removeEventListener = function(a,b,c){
                this._removeEventListener(a, b,c);
                if(this.eventListenerList){
                    var arr = this.eventListenerList;
                    for(var i =0;i《arr.length;i++){
                        if(arr.toString() === b.toString()){
                            this.eventListenerList.splice(i,1);
                        }
                    }
                }
            }
        })();
        //此后为测试代码。
        window.onload = function(){
            var dom = document.getElementById("test");
            //增加三个监听
            dom.addEventListener("click",function(){
                console.info("click function");
            },false);
            dom.addEventListener("click",function(){
                console.info("click function2");
            },false);
            dom.addEventListener("click",function(){
                console.info("click function3");
            },false);

            console.log(dom.eventListenerList.length);
            //读出监听的方法
            var clicks = dom.eventListenerList.click;
            if(clicks) clicks.forEach(function(f) {
                console.log("I listen to this function: "+f.toString());
            });
            //删除监听
            dom.removeEventListener("click",function(){
                console.info("click function");
            },false);

            console.log(dom.eventListenerList.length);
        };
    《/script》
《/head》
《body》
    《button id="test" 》测试《/button》
《/body》
《/html》