nicht angemeldet
Style Informationen sind zunächst leer
0 0 
Gunnar Bittersmann
0 0 0
Style Informationen sind zunächst leer
Moin,
ich tappe gerade im Dunkeln und weiss nicht, warum die Styleinformationen, wenn ich sie mit document.getElementById(x).style.y auslese, nicht mit den erwarteten Informationen gefüllt sind.
Da mir mein Kopf brummt vom Probieren und Suchen anbei mal ein Stück-Test-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
#foo {
position: absolute;
left: 10px;
top: 10px;
display: block;
}
</style>
<script language="javascript">
<!--
function init() {
foo = document.getElementById('foodiv');
alert(foo.style.left);
alert(foo.style.display);
foo.style.display = 'block';
foo.style.left = '100px';
alert(foo.style.left);
alert(foo.style.display);
}
-->
</script>
</head>
<body onLoad="alert(init); init();">
<div id="foodiv">bar</div>
</body>
</html>
Wenn ich diesen ausführe ist bei den ersten beiden Feldern der Wert = "", obwohl ich doch eigentlich die Angaben im CSS-Bereich gemacht habe. Man kann es ja auch visuell nachverfolgen.
Wo ist mein Denkfehler? Ich hoffe, es kann mir jemand auf die Sprünge helfen, danke.
MfG,
fwap
-
Hi!
Standardfehler. :) Javascript kann per Style keine CSS-Informationen auslesen, die per CSS gesetzt wurden. Wenn Du sie mit JS setzt, findet JS auch die Style Eigenschaften. Aber das hast Du ja schon selbst rausgefunden. Deiner Entdeckung gibt es eigentlich nichts weiter hinzuzufuegen.
-
@@Steel:
Standardfehler. :) Javascript kann per Style keine CSS-Informationen auslesen, die per CSS gesetzt wurden.
Doch, wenn diese per 'style'-Attribut gesetzt wurden. Aber das tut man ja nicht!
Deiner Entdeckung gibt es eigentlich nichts weiter hinzuzufuegen.
Doch: window.getComputedStyle() bzw. für IE currentStyle [http://forum.de.selfhtml.org/archiv/2008/1/t165198/#m1077055]
Live long and prosper,
Gunnar--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.-
@@Steel:
Standardfehler. :) Javascript kann per Style keine CSS-Informationen auslesen, die per CSS gesetzt wurden.
Doch, wenn diese per 'style'-Attribut gesetzt wurden. Aber das tut man ja nicht!
Deiner Entdeckung gibt es eigentlich nichts weiter hinzuzufuegen.
Doch: window.getComputedStyle() bzw. für IE currentStyle [http://forum.de.selfhtml.org/archiv/2008/1/t165198/#m1077055]
Live long and prosper,
Gunnardanke! genau das habe ich gesucht und zwischenzeitlich auch gefunden.
<style type="text/css"> #foodiv { position: absolute; left: 10px; top: 10px; display: block; } </style> <script language="javascript"> <!-- function init() { foo = document.getElementById('foodiv'); if (document.body.currentStyle) { fooStyle = foo.currentStyle; } else if (window.getComputedStyle) { fooStyle = window.getComputedStyle(foo, null); } alert(fooStyle); alert(fooStyle.left); } --> </script> </head> <body onLoad="init();"> <div id="foodiv">100/100</div> </body>mfg, fwap
-
@@fwap:
danke! genau das habe ich gesucht und zwischenzeitlich auch gefunden.
Gerngeschehn.
<script language="javascript">
Nun solltest du noch <http://de.selfhtml.org/javascript/intro.htm#javascriptbereiche@title=JavaScript-Bereiche in HTML definieren> suchen und finden.
'type'-Attribut fehlt; 'language'-Attribut kommt in die Mülltonne ...
<!--
... und die völlig überflüssige Auskommentierung auch.
Live long and prosper,
GunnarPS: Und zitiere bitte sinnvoll, nicht alles.
--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.
-
-
Hi!
Doch: window.getComputedStyle() bzw. für IE currentStyle [http://forum.de.selfhtml.org/archiv/2008/1/t165198/#m1077055]
Ach Mist! Schon wieder eine Sache die ich mir geschworen habe nicht zu vergessen nur um ein halbes Jahr spaeter wieder zu denken "Diesmal vergess ichs bestimmt nicht!"...
--
Trau Dich!
-
@@Steel:
Deiner Entdeckung gibt es eigentlich nichts weiter hinzuzufuegen.
Doch: window.getComputedStyle() bzw. für IE currentStyle [http://forum.de.selfhtml.org/archiv/2008/1/t165198/#m1077055]
Da habe ich noch etwas besseres: http://www.lipfert-malik.de/webdesign/tutorial/bsp/getcomputedstyle-4all.html
-
Hallo,
window.getComputedStyle() bzw. für IE currentStyle [http://forum.de.selfhtml.org/archiv/2008/1/t165198/#m1077055]
Da habe ich noch etwas besseres: http://www.lipfert-malik.de/webdesign/tutorial/bsp/getcomputedstyle-4all.html
Was ist daran besser? Die Unterstützung von Netscape 4 und IE 4, zwei gänzlich ausgestorbenen Browsern? ;)
Davon abgesehen sind diese Ansätze nämlich identisch, wenn ich nichts übersehe.
getPropertyValue ist übrigens unnötig, denn getComputedStyle gibt eine CSSStyleDeclaration zurück, die CSS2Properties implementiert. Das ist haargenau dasselbe wie style.
(Wenn man jetzt cool ist, baut man in Nicht-IE-Browsern currentStyle mit Gettern und prototypischer Erweiterung nach. ;))Mathias
-
@@molily:
(Wenn man jetzt cool ist, baut man in Nicht-IE-Browsern currentStyle mit Gettern und prototypischer Erweiterung nach. ;))
Oder man bringt IEs das standardisierte window.getComputedStyle() bei. Wäre das nicht noch cooler?
Live long and prosper,
Gunnar--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.-
Hallo,
Oder man bringt IEs das standardisierte window.getComputedStyle() bei. Wäre das nicht noch cooler?
Nö. Ehrlich gesagt finde ich, dass currentStyle das einfachere und intuitivere Interface ist. Bei getComputedStyle muss ich eine globale Methode aufrufen und ihr den Elementknoten übergeben. Zurück bekomme ich eine CSSStyleDeclaration. Ich halte es viel sinniger und stimmiger im DOM-Konzept, dass einfach der Elemenknoten eine Eigenschaft currentStyle hat.
Wobei man natürlich zugestehen muss, dass getComputedStyle seine Logik hat: Man geht von verschiedenen möglichen Views aus, und window ist nunmal defaultView. Aber solange es keinen Kontext gibt, in dem es verschiedene Views gibt (mir ist keiner bekannt), habe ich überhaupt keinen Vorteil durch diese Architektur.
Mathias
-
Yerf!
Nö. Ehrlich gesagt finde ich, dass currentStyle das einfachere und intuitivere Interface ist. Bei getComputedStyle muss ich eine globale Methode aufrufen und ihr den Elementknoten übergeben. Zurück bekomme ich eine CSSStyleDeclaration. Ich halte es viel sinniger und stimmiger im DOM-Konzept, dass einfach der Elemenknoten eine Eigenschaft currentStyle hat.
Wobei es am besten wäre, beide Konzepte parallel zu haben, da sie unterschiedliches leisten. Es macht schon einen Unterschied, ob ich als currentStyle für die Width 'auto' oder für den computedStyle '600px' bekomme.
Genau dieses Verhalten von currentStyle macht es für mich in einem Projekt unbrauchbar. Der Workaround über offsetWidth funktioniert leider auch nur, wenn ich für die Breiten von Border und Padding px-Werte per CurrentStyle bekomme, da ich sie ansonsten nicht abziehen kann. Aber das lässt sich zum Glück noch über Vorgaben für die CSS-Angaben entsprechend steuern.
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
Hallo,
Wobei es am besten wäre, beide Konzepte parallel zu haben, da sie unterschiedliches leisten. Es macht schon einen Unterschied, ob ich als currentStyle für die Width 'auto' oder für den computedStyle '600px' bekomme.
Stimmt, habe gar nicht bedacht, dass der »Current Style« erstmal nichts mit dem »Computed Style« zu tun hat...
Mathias
-
-
-
-
-
-
-