matsch333: CSS-Eigenschaften eines Objektes

Servus miteinand!

Ich möchte die CSS-Eigenschaften eines Objektes abfragen, die durch eine CSS-Klasse definiert wurden.

Beispiel:

Das hier funktioniert, so solls aussehen. Zeigt mir die Border im alert().

  
+++++++++++++  
<div style="border:solid green 1px; width:200px;" onmouseover="alert(this.style.border);" ><br/></div>  
+++++++++++++  

Problem:
Das hier geht nicht. Wie komm ich hier an die CSS-Eigenschaften ran?

  
+++++++++++++  
<style type="text/css">  
.mydiv {border:solid red 1px; width:200px;}  
</style>  
<div class="mydiv" onmouseover="alert(this.style.border);" ><br/></div>  
+++++++++++++  

Vieln Dank!

  1. @@matsch333:

    nuqneH

    Das hier geht nicht. Wie komm ich hier an die CSS-Eigenschaften ran?

    http://forum.de.selfhtml.org/archiv/2008/9/t176413/#m1160597

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    1. Om nah hoo pez nyeetz, Gunnar Bittersmann!

      http://forum.de.selfhtml.org/archiv/2008/9/t176413/#m1160597

      etwas aktueller: http://forum.de.selfhtml.org/archiv/2011/1/t202959/#m1371510

      Matthias

      --
      1/z ist kein Blatt Papier. http://www.billiger-im-urlaub.de/kreis_sw.gif
      1. Merci vielfalt an euch beide!;)

        Sorry.. ich meinte natürlich:
        qathlo’

    1. Lieber molily,

      mich wundert, warum man keine readonly-Eigenschaft namens <element>.computedStyle oder von mir aus auch <element>.cStyle definiert hat, in der die Werte so vorliegen, wie <element>.getComputedStyle() sie ermittelt.

      Kennst Du einen Grund dafür?

      Liebe Grüße,

      Felix Riesterer.

      --
      ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
      1. Kennst Du einen Grund dafür?

        Weil die Leute, die diese API erfunden haben, schlechte API-Architekten sind. Viele der W3C-DOM-APIs ließen sich vereinfachen. Man denke nur an das NodeIterator-Desaster.

        Der konkrete Grund, dass man getComputedStyle nicht bloß an ein Element koppelt, ist die Existenz von verschiedenen DOM Views. window ist die Default-View des Dokuments. Die Langschreibweise ist daher document.defaultView.getComputedStyle. Theoretisch kann es noch mehrere Views eines Dokuments geben und es sollte möglich sein, die Darstellung für ein Element auch in diesen anderen Views abzufragen. Daher ruft man getComputedStyle auf der View auf und übergibt ein Element anstatt es einfach auf einem Element aufzurufen.

        Ergibt eigentlich Sinn, nur wüsste ich nicht, wie man an eine andere View als die Default-View kommt. Zumindest im Browser gibt es immer nur die Default-View. Wie das bei serverseitigem Kram mit XSL-FO ist, weil ich nicht, vielleicht gibt es da verschiedene Views je nach Stylesheet und Ausgabemedium.

        Mathias

        1. Lieber molily,

          vielen Dank für die Klarstellungen.

          Der konkrete Grund, dass man getComputedStyle nicht bloß an ein Element koppelt, ist die Existenz von verschiedenen DOM Views. window ist die Default-View des Dokuments. Die Langschreibweise ist daher document.defaultView.getComputedStyle. Theoretisch kann es noch mehrere Views eines Dokuments geben und es sollte möglich sein, die Darstellung für ein Element auch in diesen anderen Views abzufragen.

          Wäre die "Druckvorschau" eine solche "andere" View? Manchmal fände ich es schön, wenn ich die Seite im Druckstylesheet sehen könnte, ohne dass ich extra die Ruckvorschau bemühen muss. Beispielsweise kann ich mit dem Firebug in der Druckvorschau keine Elemente untersuchen. Und das Druckstylesheet zuerst als alternatives Stylesheet einzubinden, finde ich nicht besonders praktisch, um an der Druckausgabe zu feilen.

          Liebe Grüße,

          Felix Riesterer.

          --
          ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)