JavaScript事件處理程序詳解
更新時間:2017年09月19日 08:38:19 作者:喵嘻嘻
這篇文章主要為大家詳細(xì)介紹了JavaScript事件處理程序的相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了js事件處理程序的具體代碼,供大家參考,具體內(nèi)容如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DOM0級DOM2級</title> </head> <body> <input id="btn1" type="button" value="click1" onclick="show()"> <input id="btn2" type="button" value="click2"> <input id="btn3" type="button" value="click3"> <script> function show() { alert("btn1"); } //DOM0級 var btn2 = document.getElementById("btn2"); btn2.onclick = function () { alert("DOM0級btn2"); }; //DOM2級 function show2() { alert("DOM2級btn3"); } var btn3 = document.getElementById("btn3"); // btn3.addEventListener("click",show2,false); // btn3.removeEventListener("click",show2,false); //ie事件處理程序 // btn3.attachEvent("onclick",show2); // btn3.detachEvent("onclick",show2); //跨瀏覽器事件處理程序 //能力檢測 var eventUtil = { //添加具柄; addHandler:function (element,type,handler) { if (element.addEventListener){ element.addEventListener(type,handler,false); }else if(element.attachEvent){ element.attachEvent("on"+type,handler); }else { element["on"+type]=handler; } }, //刪除具柄; removeHandler:function (element,type,handler) { if (element.removeEventListener){ element.removeEventListener(type,handler,false); }else if(element.detachEvent){ element.detachEvent("on"+type,handler); }else { element["on"+type]=null; } } }; eventUtil.addHandler(btn3,"click",show2); eventUtil.removeHandler(btn3,"click",show2); </script> </body> </html>
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
npm安裝依賴時出現(xiàn)Peer Dependencies沖突報錯解決分析
這篇文章主要為大家介紹了npm安裝依賴時出現(xiàn)Peer Dependencies沖突報錯解決分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09使用wxapp-img-loader自定義組件實現(xiàn)微信小程序圖片預(yù)加載功能
由于微信小程序沒有提供類似 Image 這樣的 JS 對象,要實現(xiàn)圖片的預(yù)加載要麻煩一些,wxapp-img-loader自定義組件可以在微信小程序中實現(xiàn)圖片預(yù)加載功能,需要的朋友可以參考下2018-10-10JS獲取時間的相關(guān)函數(shù)及時間戳與時間日期之間的轉(zhuǎn)換
時間戳和時間日期的轉(zhuǎn)換是常見的操作,下面就通過代碼實例介紹一下如何實現(xiàn)它們之間的相互轉(zhuǎn)換,感興趣的朋友一起學(xué)習(xí)吧2016-02-02