【冷知识】获取网页所有的监听事件类型、方法。请认准getEventListeners
生活随笔
收集整理的這篇文章主要介紹了
【冷知识】获取网页所有的监听事件类型、方法。请认准getEventListeners
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
?
?
??獲取事件列表
getEventListeners(window)//獲取window綁定的所有監聽事件列表//----------------------------------------getEventListeners(document.querySelector("選擇器"))//獲取指定DOM的所有監聽事件列表
這里以CSDN為例,F12當前頁面在Console選項卡輸入?getEventListeners(window),回車執行代碼后會輸出以下對象:
{"load": [{"useCapture": false, "passive": false, "once": false, "type": "load"},{"useCapture": false, "passive": false, "once": false, "type": "load"},{"useCapture": false, "passive": false, "once": false, "type": "load"},{"useCapture": false, "passive": false, "once": false, "type": "load"},{"useCapture": false, "passive": false, "once": false, "type": "load"}],"unload": [{"useCapture": false, "passive": false, "once": false, "type": "unload"},{"useCapture": false, "passive": false, "once": false, "type": "unload"},{"useCapture": false, "passive": false, "once": false, "type": "unload"},{"useCapture": false, "passive": false, "once": false, "type": "unload"},{"useCapture": false, "passive": false, "once": false, "type": "unload"}],"beforeunload": [{"useCapture": false, "passive": false, "once": false, "type": "beforeunload"}],"pagehide": [{"useCapture": false, "passive": false, "once": false, "type": "pagehide"},{"useCapture": false, "passive": false, "once": false, "type": "pagehide"}],"error": [{"useCapture": false, "passive": false, "once": false, "type": "error"}],"keydown": [{"useCapture": false, "passive": false, "once": false, "type": "keydown"}],"resize": [{"useCapture": false, "passive": false, "once": false, "type": "resize"},{"useCapture": false, "passive": false, "once": false, "type": "resize"},{"useCapture": false, "passive": false, "once": false, "type": "resize"},{"useCapture": false, "passive": false, "once": false, "type": "resize"}],"scroll": [{"useCapture": false, "passive": false, "once": false, "type": "scroll"},{"useCapture": false, "passive": false, "once": false, "type": "scroll"},{"useCapture": false, "passive": false, "once": false, "type": "scroll"},{"useCapture": false, "passive": false, "once": false, "type": "scroll"}],"orientationchange": [{"useCapture": false, "passive": false, "once": false, "type": "orientationchange"}],"pageshow": [{"useCapture": false, "passive": false, "once": false, "type": "pageshow"}],"focus": [{"useCapture": false, "passive": false, "once": false, "type": "focus"}],"blur": [{"useCapture": false, "passive": false, "once": false, "type": "blur"}],"DOMContentLoaded": [{"useCapture": false, "passive": false, "once": false, "type": "DOMContentLoaded"},{"useCapture": false, "passive": false, "once": false, "type": "DOMContentLoaded"},{"useCapture": false, "passive": false, "once": false, "type": "DOMContentLoaded"}],"keyup": [{"useCapture": false, "passive": false, "once": false, "type": "keyup"}]
};
獲取事件綁定的方法源碼
getEventListeners(window).事件名[0].listener;//----------------------------------------getEventListeners(document.querySelector("選擇器")).事件名[0].listener;
觸發事件綁定的方法
getEventListeners(window).事件名[0].listener();//----------------------------------------getEventListeners(document.querySelector("選擇器")).事件名[0].listener();
移除對應綁定的事件監聽(尤其是某些頁面禁止了復制、切屏的時候屢試不爽,你懂得[壞笑])
var event=getEventListeners(window).事件名[0];
window.removeEventListener(event.type,event.listener);//----------------------------------------var dom=document.querySelector("選擇器");
var event=getEventListeners(dom).事件名[0];
dom.removeEventListener(event.type,event.listener);
批量移除所有監聽事件(硬核!)
var events=getEventListeners(window)
for (var eventName in events) {var eventItems = events[eventName];console.log(event);for (var i = 0, l = eventItems.length; i < l; i++) {var eventItem = eventItems[i];window.removeEventListener(eventItem.type,eventItem.listener);}
}//----------------------------------------var dom=document.querySelector("選擇器")
var events=getEventListeners(dom)
for (var eventName in events) {var eventItems = events[eventName];console.log(event);for (var i = 0, l = eventItems.length; i < l; i++) {var eventItem = eventItems[i];dom.removeEventListener(eventItem.type,eventItem.listener);}
}
批量移除并打印指定DOM及其子元素所有監聽方法代碼(實用!)
var getAllEvents = function (sel) {var doms = [document.querySelector(sel)].concat([].slice.call(document.querySelectorAll(sel + " *")));//包括元素自己for (var i = 0, l = doms.length; i < l; i++) {var dom = doms[i];var events = getEventListeners(dom);for (var eventName in events) {var eventItems = events[eventName];for (var j = 0, len = eventItems.length; j < len; j++) {var eventItem = eventItems[j];dom.removeEventListener(eventItem.type, eventItem.listener);//移除事件console.log(`事件[${eventItem.type}]監聽方法`, eventItem.listener);}}}
};
getAllEvents(".className");
打印效果
總結
以上是生活随笔為你收集整理的【冷知识】获取网页所有的监听事件类型、方法。请认准getEventListeners的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 封装echarts china map
- 下一篇: 原生CSS设置预加载图片之前的默认背景图