Wie implementiert man Javascript, um den CSS-Attributwert eines Elements genau zu erhalten? Beim Umgang mit CSS-Eigenschaften von DOM-Elementen stoßen wir häufig auf ein Problem: Der CSS-Eigenschaftswert wurde auf der Seite definiert, ist jedoch beim Abrufen leer. Dies liegt daran, dass Stylesheet-Dateien oder Inline-CSS-Standardstilinformationen nicht zuverlässig wiedergegeben werden können im Stilattribut In diesem Artikel erfahren Sie, wie Sie den CSS-Attributwert eines bestimmten Elements genau ermitteln.
Javascript:
Beispiel-Quellcode
[www.downcodes.com] <script type="text/javascript">
Funktion getStyle(elem, name)
{
//Wenn dieses Attribut in style[] vorhanden ist, wurde es kürzlich festgelegt (und ist das aktuelle)
if (elem.style[name])
{
return elem.style[name];
}
// Andernfalls versuchen Sie es mit der IE-Methode
sonst wenn (elem.currentStyle)
{
return elem.currentStyle[name];
}
//Oder W3C-Methode, falls vorhanden
sonst wenn (document.defaultView && document.defaultView.getComputedStyle)
{
//Es verwendet die traditionelle Methode zum Schreiben von Regeln im „text-Align“-Stil anstelle von „textAlign“
name = name.replace(/([AZ])/g,"-$1");
name = name.toLowerCase();
//Holen Sie sich das Stilobjekt und den Wert des Attributs (falls vorhanden)
var s = document.defaultView.getComputedStyle(elem,"");
return s && s.getPropertyValue(name);
//Andernfalls verwenden Sie einen anderen Browser
}
anders
{
null zurückgeben;
}
}
</script>
