• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[GELOEST] Mehrere Elemente var btn = document.querySelector anwählen

Matthias

Mitglied
Hallo,

in meinem Footer habe ich folgenden Javascript Code

Javascript:
<script>
var btn = document.querySelector('#element-h8zCh7GK .btn');
              
 
if (btn) {
  btn.addEventListener('click', function() {
    
  fbq('track', 'Lead');

  });
}
</script>

Der Code wählt ein Seiten-Element aus. Dieses Element ist ein Button. Klickt jemand darauf, dann wird der Besucher getrackt.

Jetzt habe ich aber insgesamt 4 Button auf der Seite. Mein erster Gedanke war, den Code so umzuschreiben:

Javascript:
<script>
var btn = document.querySelector('#element-h8zCh7GK .btn');
               document.querySelector('#element-Ho8EG7eZ .btn');
              document.querySelector('#element-NyHN59S3 .btn');
              document.querySelector('#element-AhCJpKYR .btn');
              
 
if (btn) {
  btn.addEventListener('click', function() {
    
  fbq('track', 'Lead');

  });
}
</script>

Leider funktioniert damit nur das Tracking für den ersten Button.

Wie kann ich Javascript so umschreiben, dass alle Button-Element erfasst werden?

Danke
 
Werbung:
Ich habe mir die Links angeschaut, aber meine Javascript Kenntnisse reichen bei weitem nicht aus, um das richtig zu schreiben.

Bisher habe ich das hier probiert:


Code:
<script>
var btn = document.querySelectorAll("#element-h8zCh7GK .btn,#element-Ho8EG7eZ .btn,#element-NyHN59S3 .btn,#element-AhCJpKYR .btn");
              
 
if (btn) {
  btn.addEventListener('click', function() {
    
  fbq('track', 'Lead');

  });
}
</script>

Das funktioniert aber leider nicht.

Es gehlt auch das foreach, da mir nicht klar ist, wie ich das dort einsetzen soll.

Kann mir das jemand schnell schreiben? Das wäre super.

Danke
 
Danke,

ich habe es eingebaut.


Hat aber leider nicht funktioniert.

Hat es mit "const btns" zu tun? Ursprünglich mit nur einer Variable hieß es noch var btn.

Ich wüsste jetzt nicht welche zusätzlichen Infos ich liefern könnte. Einen Link zur Webseite veröffentliche ich ungerne in einem Forum.
 
Werbung:
Wieso muss ein Selector so tief ausdifferenziert werden?

Abgesehen davon ist das Anhängen von Eventlistenern per Schleife bad practice.
 
Werbung:
Danke für die Hilfestellung.

Das Problem ist gelöst.

Folgender Code hat zum Ziel geführt:

Javascript:
<script>
var btns = document.querySelectorAll('#element-vDSmTJuq .btn, #element-vDSmTJuq2 .btn, #element-vDSmTJuq3 .btn');

for (var i = 0; i < btns.length; i++) {
var btn = btns[i];

btn.addEventListener('click', function() {

fbq('track', 'Lead');

});

}
</script>

Leider sehe ich nicht, wie ich das Thema als gelöst markieren kann.
 
Ich würde mir die anderen Beiträge anschauen und Event Delegation verwenden. Dein Weg ist einfach uneffizient und bad practice.
 
Werbung:
Zurück
Oben