为什么当元素的子元素的过渡结束时可以运行transitionend事件？

我绑定了一个transitionend事件至div1. When div1的转换结束，事件开始。这里没有问题。

我遇到一个特殊情况：

我在此添加了 3 段div1，当每个段落的转换结束时，div1's transitionend活动也跑了。所以transitionend活动举办了4次。 >.

In div1's transitionend事件监听器函数的主体，我可以看到event.target !== this。我觉得实在是太可笑了！

Chrome 和 Firefox 都有这个问题。所以我猜这不是浏览器的 HTML5 规范实现错误。

谁能解释为什么一个元素transitionend事件也可以由该元素的子元素触发吗？

谢谢。

这称为事件冒泡。默认情况下，在原始对象上调用事件处理程序后，子元素上发生的许多事件将通过父元素向上冒泡。您可以通过检查所注意到的方式来检测冒泡event对象，或者您可以通过在处理源对象上的事件时停止传播来防止冒泡。

停止传播是 IE 与其他浏览器的不同之处之一。在其他浏览器中，您可以调用：

event.stopPropagation()

在 IE9 之前的 IE 中：

window.event.cancelBubble = true;