1、自定义事件

浏览器自带事件 共100多种事件
自定义一个事件：http://js.jirengu.com/kepir/1/edit?html,js,console,output

  1.   <div id=div1>
  2.     <button id=button1>点击button触发frank事件</button>
  3.   </div>
  1. button1.addEventListener('click',()=>{
  2.   const myevent = new CustomEvent('frank',
  3.     {
  4.         detail:{age:18,name:'frank'},
  5.         //bubbles:true  表示这个自定义事件可以冒泡
  6.         bubbles:true,
  7.       cancelable:false
  8.     }
  9.   )
  10.   //点击button1触发frank事件
  11.   button1.dispatchEvent(myevent)
  12. })
  13. //给button1添加frank事件监听
  14. button1.addEventListener('frank',(e)=>{
  15.   console.log('frank')
  16.   //打印这个自定义事件的信息
  17.   console.log(e)
  18.   console.log(e.detail)
  19.   console.log(e.bubbles)
  20. })

运行结果：
image.png