Wie font-size eines div deklariert in css-Datei auslesen?
Dieter
- javascript
Hallo!
Wie bekomme ich z.B. font-size und fonz-family -Werte, die in einer css-Datei deklariert wurden?
Im css z.B.
div.einedivklasse { font-size:25px; font-family:"Times New Roman" }
Im html-Code sieht das div so aus
<div class="einedivklasse" id="meindiv">Text</div>
Wie lautet denn nun der Javascript-Code???
Ich kriege es nicht raus. WEDER mit getAttribute noch mit .style.fontsize oder fontfamily funktioniert es!!!
Z.B.
alert("document.getElementById("meindiv").getAttribute("font-size");
alert("document.getElementById("meindiv").style.fontsize;
Ist das etwa ein Firefox-Fehler? Ich habe Firefox 1.5.
MfG
Dieter
Hallo,
Über .style.eigenschaft kannst du nur CSS-Eigenschaftswerte auslesen, die über Inline-Styles (<element style="color:red">) gesetzt wurden bzw. eben auf diese Weise mittels JavaScript.
Wenn du den tatsächliche Wert auslesen willst, den ein Element hat, nachdem alle ausgelagerten Style-Regeln angewendet wurden, so musst du den sogenannten »computed value« abfragen. Gemäß dem DOM-Style-Standard geht das folgendermaßen:
var element = document.getElementById("meindiv");
var styledeclaration = window.getComputedStyle(element, null);
var eigenschaftswert = styledeclaration.getPropertyValue("font-size");
alert(eigenschaftswert);
Das funktioniert in Firefox, Opera, Konqueror und soweit ich weiß Safari.
Der MSIE implementiert diesen Teil des Standards nicht, kennt aber das Objekt currentStyle, was eine ähnliche Funktionalität bietet.
var element = document.getElementById("meindiv");
var eigenschaftswert = element.currentStyle.fontSize;
alert(eigenschaftswert);
Zusammen mit einer Cross-Browser-Objekterkennung:
var element = document.getElementById("meindiv");
var eigenschaftswert;
if (window.getComputedStyle) {
var styledeclaration = window.getComputedStyle(element, null);
eigenschaftswert = styledeclaration.getPropertyValue("font-size");
} else if (element.currentStyle) {
eigenschaftswert = element.currentStyle.fontSize;
}
alert(eigenschaftswert);
Im Forumsarchiv wirst du dazu einiges finden, etwa eine allgemeinere Funktion.
Mathias
Hallo!
Vielen Dank!
Schade, dass das nicht in selfhtml selbst steht.
Ist schon bekannt, ob noch ein update kommt?
Mir ist schon klar, dass es immer schwieriger wird, selfhtml kostenloas und aktuell zu halten.
Grüße
Dieter
Hi,
Schade, dass das nicht in selfhtml selbst steht.
Es heißt halt self*HTML* und nicht selfJavaScript! Bezügl. JS ist selfHTML haarsträubend veraltet und unvollständig. Und ja: Das finde ich auch schade.
Gruß, Cybaer