Mehrere Details zu JavaScript-Ereignissen

1. Einfangen oder Sprudeln

Mir wurde gestern eine Frage gestellt: Wie viele Stufen hat der Event-Flow? Wie oft trat das Ereignis in diesen Phasen auf?

Die Frage ist sehr einfach, aber es ist etwas verwirrend, wie oft das Ereignis aufgetreten ist. Ich habe immer das Gefühl, dass das Einfangen auch Ereignisse auslösen kann, und das Sprudeln kann auch Ereignisse auslösen, aber das Ereignis ist nur einmal passiert! Deshalb habe ich einen Artikel geschrieben, um das Problem zu klären. Schüler, die das sehr gut wissen, können es überspringen.

Unterfrage 1: Wie viele Phasen gibt es im Ereignisfluss?

Der durch „DOM2-Level-Ereignisse“ angegebene Ereignisfluss umfasst drei Phasen: Ereigniserfassungsphase, Zielphase und Ereignisblasenphase.

1. IE-Browser vor IE9 unterstützen nur die letzten beiden Phasen, nämlich die Zielphase und die Event-Bubbling-Phase. Diese Abfolge ist leicht zu verstehen. Ereignisse werden auf dem Knoten mit der tiefsten Verschachtelungsebene empfangen und dann Schritt für Schritt an den übergeordneten Knoten weitergegeben.

2. Ein weiterer vom frühen Netscape-Team vorgeschlagener Event-Stream heißt Event Capture. Das heißt, der Knoten der obersten Ebene sollte das Ereignis früher empfangen und schrittweise an den Knoten mit der tiefsten Verschachtelungsebene weitergeben, d. h. an die Ereigniserfassungsstufe und die Zielstufe

3. Moderne Browser wie Chrome, ff, IE9 usw. unterstützen die gesamten drei Stufen.

Unterfrage 2: Wie oft ereignete sich der Vorfall in diesen Phasen?

Wenn ein Ereignis auftritt, durchläuft der Ereignisfluss von „DOM2-Level-Ereignissen“ drei Phasen (Erfassung -> auf Ziel -> Sprudeln), aber nicht jede Phase kann auftreten. Wenn der dritte Parameter der addEventListener-Methode für einen Knoten wahr ist, tritt das Ereignis in der Erfassungsphase auf. Wenn er falsch ist, tritt das Ereignis in der Bubbling-Phase auf. Das Ereignis ist also nur einmal passiert!

Wenn der äußere Knoten möchte, dass Ereignisse sowohl in der Erfassungs- als auch in der Bubbling-Phase auftreten, registrieren Sie ihn zweimal.

Übrigens haben auch „DOM Level 0 Events“ (elem.onclick = function () {...}) Event-Bubbling.

2. Registrierungssequenz von Ereignissen

Registrieren Sie mehrere Ereignisse auf demselben Knoten.

Verwenden Sie addEventListener, es wird passieren Die Reihenfolge basiert auf der Reihenfolge, in der Ereignisse hinzugefügt werden.

Bei Verwendung von attachmentEvent wird die Reihenfolge des Auftretens umgekehrt und das später registrierte Ereignis tritt zuerst auf.

3. Ereignisse entfernen

Die Methoden zum Entfernen von Ereignissen „removeEventListener“ und „detachEvent“ gelten für dieselbe Rückruffunktion, wenn das Ereignis auftritt. Daher werden beim Registrieren von Ereignissen anonyme Funktionen verwendet. kann nicht entfernt werden.