文章詳情頁
javascript - 關于原生js如何實現jquery的on()方法。
瀏覽:102日期: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. javascript - webpack 報錯 新人 求解2. nginx 80端口反向代理多個域名,怎樣隱藏端口的?3. android - NavigationView 的側滑菜單中如何保存新增項(通過程序添加)4. node.js - 跑antd的的模板例子!想修改端口,怎么修改呢!!(里面好像用了什么dora插件!!!)5. angular.js - angular做點擊購買時的遮罩層6. angular.js - 關于ng-model和ng-bind的疑問7. 有大佬知道這種接口文件怎么使用嗎?8. 關于thinkphp 5.1中,ajax提交數據url的格式寫法,加花括號就出錯,請老師指點9. tp5 不同控制器中的變量調用問題10. AirPods Pro 2連接Pixel 7出問題:播放90秒自動斷連
排行榜
