Was ist Ereignis in JavaScript erfasst?
In JavaScript können verschiedene Arten von Ereignissen durchgeführt werden, einschließlich Ereigniserfassungen und Ereignisblasen. Zum Beispiel propagiert Ereigniserfassungen vom Stammelement zum untergeordneten Element. Auf der anderen Seite verbreitet sich das Ereignis, das sprudelt. Die Ereignis erfassen “AddEventListener ()”Methode kann verwendet werden.
Dieser Beitrag erklärt das Erfassen von JavaScript -Ereignissen.
Was ist Ereignis in JavaScript erfasst?
Ereigniserfassung ist ein bestimmtes Szenario, in dem die generierten Ereignisse von den übergeordneten Elementen beginnen und sich in Richtung des Ziels/untergeordneten Elements bewegen, das den Ereigniszyklus initiierte. Es unterscheidet sich völlig vom Ereignisblasen, bei dem sich Ereignisse von der Spezifikation zu den äußersten Elementen nach außen ausbreiten. Darüber hinaus tritt die Erfassung von Elementen vor, bevor er sprudelt.
Syntax
AddEventListener (Typ, Hörer, Uscapture)
In dieser Syntax:
- “Typ”Bestimmt die Art des Ereignisses.
- “HörerDefiniert die Anruffunktion, wenn ein bestimmtes Ereignis auftritt.
- “usecapture”Zeigt den standardmäßigen Booleschen Wert an und zeigt, dass er sich in der sprudelnden Phase befindet.
Beispiel 1: Ereigniserfassung des Tastenelements
Zuerst fügen Sie eine "hinzu"divContainer und weisen Sie eine ID mit einem bestimmten Namen zu, um das Ereignis zu erfassen. Als nächstes verwenden Sie die “Element, um eine Schaltfläche zu erstellen und einen Text einzubetten, um auf der Schaltfläche anzuzeigen:
Darüber hinaus dazwischen “Erstens auf den "Element" auf die "QuerySelector ()Methode und übergeben die “Ausweis”Um die deklarierte Variable auszuwählen und zu speichern:
var Parentelement = Dokument.QuerySelector ('#main');
Greifen Sie dann mithilfe der Schaltflächen -ID mit der Schaltflächen -ID auf die Schaltfläche zuQuerySelector ()”:
var Childelement = Dokument.querySelector ('#btn');
Aufrufen "AddEventListener ()”Und verabschieden die Veranstaltung. Dieses Ereignis funktioniert, wenn der Benutzer auf die Schaltfläche klickt. Es wird das übergeordnete Element auf jeder Schaltfläche ausgelöst. Klicken Sie und drucken Sie das Ergebnis in der Konsole:
Parentelement.AddEventListener ('Click', function ()
Konsole.log ("übergeordnetes Element aufrufen");
,WAHR);
Verwenden Sie die “Kinder.AddEventListener ()Methode zum Aufrufen des untergeordneten Elements auf jedem Schaltfläche Klicken Sie auf Ereignis. Rufen Sie dann die Konsole an.LOG () Methode zur Anzeige des Ergebnisses auf der Konsole:
Kinder.AddEventListener ('Click', function ()
Konsole.log ("auf das untergeordnete Element aufrufen");
);
Es kann beobachtet werden, dass das Ereignis bei jedem Schaltflächenklick erfolgreich erfasst wurde:
Beispiel 2: Ereigniserfassung des Absatzelements
Verwenden Sie die “, um das Ereignis eines Absatzelements zu erfassen Erste Zweite Dritte Definieren Sie eine "Event_capturing ()Funktion und verwenden Sie den folgenden folgenden Code: Rufen Sie die definierte Funktion auf, um auf dem Bildschirm anzuzeigen: Hier geht es um das Ereignis, das in JavaScript erfasst wird. Abschluss Ereigniserfassung beginnt, das Element vom Elternteil zu verbreiten und wechselt in das Ziel/untergeordnete Element, das den Ereigniszyklus initiierte. Die Ereignis erfassen “AddEventListener ()”Methode kann verwendet werden. Dieser Beitrag hat die Methode zur Durchführung von Ereigniserfassungen demonstriert.
Funktion event_capturing ()
var All_p = Dokument.GetElementsByTagName ("P");
für (var i = 0; i < All_p.length; i++)
All_p [i].AddEventListener ("Click", ClickHandler, True);
Funktion ClickHandler ()
Alarm (das.getAttribute ("id") + "Ereignis erfolgreich behandelt");