文章詳情頁
javascript - 關于原生js如何實現jquery的on()方法。
瀏覽:152日期:2023-03-05 10:05:08
問題描述
原生js如何實現jquery的on()方法,并且支持給一個元素同時綁定多個事件?
例如:
element.on(’click mouseout’,function(){...});
這樣的話用原生JS怎么實現?
問題解答
回答1:給你一個簡單的示例,如果你想在原生的JS中,使用on方法,可以這樣寫:
HTMLElement.prototype.on = function(events, callback){ let evs = events.split(’ ’); for(let event of evs){this.addEventListener(event, callback); } // 如果你想像JQuery一樣支持鏈式調用,可以在這里返回this // return this;}
這樣的寫法有很多漏洞,因為很多情況都沒有考慮。比如IE的事件綁定沒有考慮。比如多個事件沒有考慮多個回調。
但是。畢竟是要告訴你思想,而不是給你重復造個輪子。
JQuery的實現大概也是這么個邏輯,你可以使用這樣的方法去封裝屬于自己的庫。
回答2:addEventListener
標簽:
JavaScript
相關文章:
1. 前端 - 應該先從angularJS , vue.js , react 這些框架中的哪個開始入手?2. 用工具實現在微信里面生成帶二維碼的海報?3. angular.js - angurlarJS的安卓的微信端中用加載ngCookies會出錯的問題4. PHPstudy創建網站成功,用瀏覽器打開文件,瀏覽器地址顯示“loaclhost:63342/,錯5. javascript - windows下如何使用babel,遇到了困惑6. css3 - IE678兼容last-child的方法 請教7. html5 - 前端面試碰到了一個緩存數據的問題,來論壇上請教一下8. node.js - 利用vue-cli 構建執行到npm run dev 報錯,求解~9. javascript - jq 上傳圖片成功后添加一個新的上傳框時出現問題10. javascript - 如何使用nodejs 將.html 文件轉化成canvas
排行榜
