Wie kann man Ereignis-Listener effizient an mehrere Elemente in JavaScript anhängen?

Ereignis-Listener mühelos an mehrere Elemente anhängen

Frage:

Gibt es eine effiziente Möglichkeit, Ereignis-Listener an mehrere Elemente anzuhängen? Elemente gleichzeitig, wodurch die Notwendigkeit einer separaten Ereignisbehandlung für jedes Element vermieden wird?

Beispiel:

Traditionell werden Ereignis-Listener einzeln hinzugefügt:

element1.addEventListener("input", function() {
  // this function does stuff
});

element2.addEventListener("input", function() {
  // this function does stuff
});

Antwort:

In JavaScript können Sie die Methode forEach() für ein Array von Elementen verwenden, um Ereignis-Listener für jedes Element in einer einzelnen Codezeile zu erstellen.

Lösung:

Um dies zu erreichen, erstellen Sie ein Array, das Ihre Elemente enthält:

let elementsArray = document.querySelectorAll("whatever");

Verwenden Sie dann die Methode forEach(), um das Array zu durchlaufen und Fügen Sie jedem Element einen Ereignis-Listener hinzu:

elementsArray.forEach(function(elem) {
    elem.addEventListener("input", function() {
        // This function does stuff
    });
});

Dieser Ansatz bietet eine präzise und effiziente Möglichkeit, Ereignis-Listener zu mehreren Elementen hinzuzufügen und so Ihren Ereignisverarbeitungscode zu optimieren.

Das obige ist der detaillierte Inhalt vonWie kann man Ereignis-Listener effizient an mehrere Elemente in JavaScript anhängen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!