Question

运行此代码时，为什么首先触发.body事件？

document.addEventListener('click', function() {
  console.log('The document was clicked');
});

document.body.addEventListener('click', function() {
  console.log('The document body was clicked');
});

Answer 1

它不运行更快，它运行更快。

事件从您单击的元素起泡，直到事件到达主体（触发主体上的事件侦听器）为止，然后继续冒泡直到到达文档（触发事件监听器的地方）。 / p>

有关更多详细信息，图表以及如何在捕获阶段捕获事件，请参见MDN。

Answer 2

简单地是因为它们都将被气泡阶段激活，所以它从下到上运行，因此body.listener首先工作，然后document.listener

Answer 3

这是由于冒泡。这样想吧

文档身体点击

我单击文档正文在体内注册事件然后在文档中注册

因此，即使首先将文档代码编写为文档。身体是第一个收到事件的人

为什么document.body.addEventListener事件先于document.addEventListener运行？

3 个答案: