JavaScript addEventListener()事件监听方法

addEventListener()方法将事件处理程序附加到指定的元素。
addEventListener()方法将事件处理程序附加到元素，而不覆盖现有的事件处理程序。
您可以向一个元素添加许多事件处理程序。您可以向一个元素添加许多相同类型的事件处理程序，即两个“单击”事件。
您可以将事件侦听器添加到任何DOM对象，而不仅仅是HTML元素。即window对象。
addEventListener()方法可以更容易地控制事件对冒泡的反应。
使用addEventListener()方法时，JavaScript与HTML标记分离，以提高可读性，
并允许您添加事件侦听器，即使您不控制HTML标记也是如此。
您可以使用removeEventListener()方法轻松删除事件侦听器。
语法：element.addEventListener(event, function, useCapture);
第一个参数是事件的类型（如“ click”或“ mousedown”）。
第二个参数是我们想要在事件发生时调用的函数。
第三个参数是一个布尔值，指定是使用事件冒泡还是事件捕获。此参数是可选的。
event:必须字符串指定事件名称
注意：不要使用‘on’前缀，例如：使用‘click’而不是‘onclick’(dom事件)
function：必须指定要事件触发时执行的函数
事件对象会作为此函数的第一个参数传人，事件类型取决于event属于那种对象例如click属于MouseEvent对象。此处是回调函数而不是执行体（alert（‘hello’）属于执行体，可以使用匿名函数替代function（）{alert(‘hellow’);}不然会在刷新时调用alert而监听无效）
useCapture:可选 布尔值 指定事件是否在捕获或冒泡阶段执行
true:事件句柄在捕获阶段执行
false:默认时间句柄在冒泡阶段执行
捕获过程是由外到里也就是外层div先捕获，如果为true则外层先执行，冒泡是由里向外的，也就是捕获过程结束后事件会向外冒泡为false的会在此阶段执行。