简单监听DOM事件
很多人还在这样做:
element.addEventListener('type', obj.method.bind(obj))
element.addEventListener('type', function (event) {})
element.addEventListener('type', (event) => {})
上面所有的例子都创建了一个匿名事件监控句柄,且在不需要时无法删除它。这在你不需要某句柄,而它却被用户或事件冒泡偶然触发时,可能会导致性能问题或不必要的逻辑问题。
更安全的事件处理方式如下:
使用引用:
1 | const handler = function () { |
命名的函数移除它本身:
1 | element.addEventListener('click', function click(e) { |
更好的写法:
1 | function handleEvent (eventName, {onElement, withCallback, useCapture = false} = {}, thisArg) { |
原文作者: anhr
原文链接: http://yoursite.com/2019/11/04/javascript/2016-03-16-DOM-event-listening-made-easy/
版权声明: 转载请注明出处(必须保留原文作者署名原文链接)