讲述事件的响应过程

一个事件的传递过程包含三个阶段,分别称为:捕获阶段、目标阶段、冒泡阶段

addEventListener的第三个参数设置为true和false的区别:

true表示该元素在事件的“捕获阶段”(由外往内传递时)响应事件;

false表示该元素在事件的“冒泡阶段”(由内向外传递时)响应事件。

当鼠标点击一个dom元素时,发生了一系列的事件传递。

假设:点击了一个button

<html>
  <body>
    <button>Click Me!</button>
  </body>
</html>

button被body包裹起来,body被html包裹起来,html被document包裹起来,document被window包裹起来;

在鼠标点下去的时候,最先响应这个click事件的是最外面的window,然后层层传递到最后的目标button;

当传到button之后,这个click事件再像水底的泡泡一样慢慢往外层穿出,直到window结束。