将事件侦听器添加到能够使用事件委托的元素。

• 用于EventTarget.addEventListener()向元素添加事件侦听器。
• 如果有target提供给选项对象的属性，请确保事件目标与指定的目标匹配，然后通过提供正确的this上下文来调用回调。
• 省略opts默认为非委托行为和事件冒泡。
• 返回对自定义委托函数的引用，以便可以使用 with off。

JavaScript

const on = (el, evt, fn, opts = {}) => {  const delegatorFn = e =>    e.target.matches(opts.target) && fn.call(e.target, e);  el.addEventListener(    evt,    opts.target ? delegatorFn : fn,    opts.options || false  );  if (opts.target) return delegatorFn;};

示例：

const fn = () => console.log('!');on(document.body, 'click', fn); // logs '!' upon clicking the bodyon(document.body, 'click', fn, { target: 'p' });// logs '!' upon clicking a `p` element child of the bodyon(document.body, 'click', fn, { options: true });// use capturing instead of bubbling

更多内容请访问我的网站：https://www.icoderoad.com