Ist getElementByClass sicher in Browsern wie getElementById zu verwenden?

Question

Ist getElementByClass sicher in Browsern wie getElementById zu verwenden?

aktualisiert Derzeit verwenden:

window.opener.document.getElementById 

Aber ich will das Objekt von Klassennamen verweisen (es wird nur ein Element mit dem Klassennamen sein).

Answer 1

IIRC, getElementsByClassName wurde in Firefox 3, Safari 3.1 eingeführt und war seit Anfang in Chrome. Ich weiß nicht, ob/wann es zu Opera hinzugefügt wurde, aber es ist überhaupt nicht im Internet Explorer vorhanden. (Obwohl kann es durch die Erweiterung der DOM-Prototypen zu IE8 hinzugefügt werden, siehe Grant's answer.)

Mit anderen Worten, wenn Sie einen Cross-Browser wollen getElementsByClassName, müssen Sie entweder Ihre eigene Rolle oder einen Rahmen verwenden.

Answer 2

Wie bereits erwähnt, ist getElementsByClassName im Internet Explorer nicht verfügbar.

Informationen zur Implementierung der Funktionalität in IE finden Sie im Abschnitt Customizing the DOM von Document Object Model Prototypes, Part 1: Introduction.

Answer 3

Wenn Sie es wirklich verwenden möchten, können Sie testen, ob das Objekt getElementsByClassname unterstützt, bevor Sie es verwenden, und auf eine JS-Implementierung der Funktion zurückgreifen, wenn der Browser dies nicht unterstützt.

Answer 4

würde ich vorschlagen, eine Wrapper-Bibliothek wie prototype.js oder jQuery verwenden, die sowohl einen CSS-Selektor-Modell unterstützen und Browser-Kompatibilitätsprobleme behandeln (IE6-7 in der Regel die größeren Probleme zu sein)

Answer 5

getElementsByClassName ist leider nicht zuverlässig Cross-Browser. Es wird derzeit von den neuesten Versionen von Firefox, Opera, Safari und Chrome, aber überhaupt nicht in Internet Explorer oder Konqueror gemäß Quirksmode unterstützt.

Wenn Sie es Cross-Browser verwenden möchten, müssen Sie müssen für diese Browser eine eigene Implementierung zur Verfügung zu stellen, die diese Funktion nicht unterstützen, like in PPK's blog:

function getElementsByClassName(node,classname) { 
    if (node.getElementsByClassName) 
     return node.getElementsByClassName(classname); 
    else { 
     // your custom function 
    } 
}