Wie wähle ich Elemente nach Attribut aus, wenn querySelectorAll fehlt?

So rufen Sie Elemente nach Attribut ab, wenn querySelectorAll nicht verfügbar ist

Trotz ihrer Verbreitung ist die Methode querySelectorAll möglicherweise nicht allgemein zugänglich. Ältere Browser wie IE7 verfügen beispielsweise nicht über diese Funktionalität. Es ist jedoch möglich, mit einem nativen Ansatz, der die Kompatibilität mit IE7 gewährleistet, ähnliche Ergebnisse zu erzielen.

Stellen Sie sich das folgende Szenario vor:

<p data-foo="bar"></p>

Typischerweise würde man querySelectorAll verwenden, um Elemente basierend auf abzurufen ihre Attribute:

document.querySelectorAll('[data-foo]')

Wenn jedoch querySelectorAll nicht vorhanden ist, ist eine alternative Lösung erforderlich.

Um die gleiche Funktionalität nativ zu erreichen, kann eine JavaScript-Funktion erstellt werden:

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) {
      matchingElements.push(allElements[i]);
    }
  }
  return matchingElements;
}

Diese Funktion durchläuft das gesamte Dokument und ruft alle Elemente mit einem bestimmten Attribut ab. Durch den Aufruf:

getAllElementsWithAttribute('data-foo');

kann man effektiv Elemente mit dem „data-foo“-Attribut abrufen. Diese Lösung ist sowohl umfassend als auch mit IE7 kompatibel und ermöglicht den Zugriff auf Elemente nach Attributen auch in Browsern ohne querySelectorAll.

Das obige ist der detaillierte Inhalt vonWie wähle ich Elemente nach Attribut aus, wenn querySelectorAll fehlt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!