Wie rufe ich Elemente nach Attributen in Pre-querySelectorAll-Browsern ab?

Abrufen von Elementen nach Attributen in Pre-querySelectorAll-Browsern

Browsern vor IE9 fehlt die leistungsstarke querySelectorAll()-Methode, was eine Herausforderung darstellt, wenn Sie Elemente basierend auf abrufen müssen spezifische Attribute. Um dieses Problem zu beheben, untersuchen wir eine native Lösung, die in IE7 und höher funktioniert.

Verwendung von getElementsByTagName und Attributprüfung

Wir können die Funktionalität von querySelectorAll simulieren, indem wir die Methode getElementsByTagName nutzen. Erstellen wir eine Funktion namens getAllElementsWithAttribute, um Elemente mit einem bestimmten Attribut zu finden:

<code class="js">function getAllElementsWithAttribute(attribute) {
  var matchingElements = [];
  var allElements = document.getElementsByTagName('*');
  for (var i = 0, n = allElements.length; i < n; i++) {
    if (allElements[i].getAttribute(attribute) !== null) {
      // Element has the attribute. Add it to the array.
      matchingElements.push(allElements[i]);
    }
  }
  return matchingElements;
}</code>

Diese Funktion verwendet einen Attributnamen als Argument und durchläuft alle Elemente im Dokument. Für jedes Element wird geprüft, ob das angegebene Attribut vorhanden und nicht null ist. Wenn ja, wird das Element zu einem Array übereinstimmender Elemente hinzugefügt.

Verwendungsbeispiel

Um alle Elemente mit dem data-foo-Attribut abzurufen, rufen Sie einfach auf:

<code class="js">getAllElementsWithAttribute('data-foo');</code>

Dieser Ansatz bietet eine native Lösung zum Abrufen von Elementen anhand von Attributen in Browsern, denen querySelectorAll fehlt, und stellt so die Kompatibilität mit IE7 und höher sicher.

Das obige ist der detaillierte Inhalt vonWie rufe ich Elemente nach Attributen in Pre-querySelectorAll-Browsern ab?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!