自定义事件 js

// 原理如下
// 创建 类型为HTMLEvents的事件 var evt = document.createEvent("HTMLEvents"); // 初始化 自定义eee 事件 evt.initEvent("eee", false, false);
// 事件绑定
document.addEventListener("eee", function(e) { console.log(e) })

// document标签触发事件(直接运行代码触发)
document.dispatchEvent(evt);

 二、不使用标签

class EventEmitter {
  events = {}
  emit(key, ...data) {
    if (this.events[key]) {
      this.events[key].forEach(it => it(...data))
    }
  }

  on(key, fn) {
    if (!this.events[key]) {
      this.events[key] = []
    }
    this.events[key].push(fn)
  }

  off(key, fn) {
    if (!this.events[key]) {
      return false
    }
    if (!fn) {
      return (this.events[key] = null)
    }
   this.events[key] = this.events[key].filter(it => it !== fn)

  }
}
原文地址:https://www.cnblogs.com/gsgs/p/8421711.html