Simon Schneiter: DOM Problem mit eingebundenem CSS-Stylefile

Beitrag lesen

Hallo!

Ich bin nun am Ende meines Lateins angelangt. Und zwar versuche ich via Javascript
 die Breite einer Tabelle zu lesen. Wenn ich diese Breite direkt in der Tabelle festlege, so ist funktioniert das bestens:

-------- html-datei---------------
<html>
<head>
</head>
<body>

<table border="2">
  <tr><td id="viewframe" style="width:300px;">
    Tabellen-Inhalt
  </td></tr>
</table>

<script>
alert(document.getElementById("viewframe").style.width);
</script>

</html>
-----------------------------------

Soweit so gut.
Nun möchte ich aber die Style-Definition in einem eigenen *.css-File machen.

--------  stylesheet.css ----------
.screen_td_1{
  background-color:#69B64B;
  border:2px solid red;
  width:280px;
}
-----------------------------------

und dazu die angepasste html-datei:

-------- html-datei----------------
<html>
<head>
  <link rel="stylesheet" type="text/css" href="stylesheet.css"/>
</head>
<body>

<table border="2">
  <tr><td id="viewframe" class="screen_td_1">
    Tabellen-Inhalt
  </td></tr>
</table>

<script>
alert(document.getElementById("viewframe").style.width);
</script>

</html>
-----------------------------------

Nun erhalte ich aber keine Ausgabe der Breite der Zelle. Komisch, denn die Zellenfarbe die ich in der CSS-Datei definiere wird korrekt angezeigt.

Aendere ich die alert()-Zeile wie folgt:
"alert(document.getElementById("viewframe").style);"
so erhalte ich die Ausgabe: "[object CSSStyleDeclaration]"
und zwar in beiden Beispielen.

Muss auf eine andere Art zugegriffen werden, wenn separate CSS-Files im Spiel sind? Ich habe keine Hinweise darauf gefunden und weiss nun aber wirklich nicht wie weiter.

Ich bin sehr dankbar für Hilfe und Hinweise wie ich das Problem lösen kann!
Vielen Dank im voraus,
Simon Schneiter