Grundlagen der Arbeit mit dem Event-Objekt in JavaScript
In dieser Lektion werden wir die Grundlagen der Arbeit
mit dem Objekt Event studieren. Dieses Objekt enthält
Informationen über das eingetretene Ereignis.
Zum Beispiel, wenn auf ein Element geklickt wurde,
können wir die Koordinaten dieses Klicks herausfinden, ob
die Taste Ctrl, Alt
oder Shift im Moment des Klicks gedrückt wurde und so weiter.
Schauen wir uns an, wie man das Objekt Event erhält.
Nehmen wir an, wir haben eine Schaltfläche:
<button id="elem">text</button>
Nehmen wir an, bei einem Klick auf diese Schaltfläche wird eine bestimmte Funktion ausgeführt:
let elem = document.querySelector('#elem');
elem.addEventListener('click', function() {
});
Innerhalb der gebundenen Funktion ist das Objekt
Event bereits vorhanden - wir wissen nur noch nicht,
wie man es erhält. Es erhält sich auf folgende
Weise: man muss bei der Deklaration unserer Funktion
ihr einen Parameter übergeben (eine beliebige Variable,
in der Regel event - aber der Name
kann beliebig sein) und in diese Variable wird
der Browser automatisch das Objekt Event legen:
elem.addEventListener('click', function(event) {
console.log(event); // werden das Objekt mit dem Ereignis sehen
});
Führen Sie die beschriebenen Manipulationen selbständig durch und geben Sie das Objekt mit dem Ereignis in der Konsole aus. Studieren Sie die Struktur dieses Objekts.