javascript - window.onkeydown 和 document.onkeydown 有区别吗？

Question

我在网上看到的大部分代码都使用了document.onkeydown，但是MDN只列出了window.onkeydown . This comment还建议使用 window.onkeydown。使用其中一个有什么区别或原因吗？

Answer 1

请参阅 Event dispatch and DOM event flow 中的下图:

一共有三个event phases :

• The capture phase: the event object must propagate through the target's ancestors from the defaultView to the target's parent. This phase is also known as the capturing phase. Event listeners registered for this phase must handle the event before it reaches its target.

• The target phase: the event object must arrive at the event object's event target. This phase is also known as the at-target phase. Event listeners registered for this phase must handle the event once it has reached its target. If the event type indicates that the event must not bubble, the event object must halt after completion of this phase.

• The bubble phase: the event object propagates through the target's ancestors in reverse order, starting with the target's parent and ending with the defaultView. This phase is also known as the bubbling phase. Event listeners registered for this phase must handle the event after it has reached its target.

因此，主要区别在于，在冒泡阶段，添加到window 的事件监听器将在添加到document 的事件监听器之后处理事件；在捕获阶段之前。