1UnitedPower: Canvas und Attribut vs. CSS

Beitrag lesen

Meine Herren,

Grundsätzlich ist es ja nicht schlimm, wenn da ein paar Attribute drinstehen, aber es spricht gegen strikte Trennung von Inhalt und Design und ist bei Änderungen mehr Aufwand.

Dieser Fall bildet eine Ausnahme. Schau dir mal das Canvas-Element in der Konsole an (console.dir statt console.log). Dir wird auffallen, dass dort zwei verschiedene Arten von Attributen stehen, die beide etwas mit Höhe und Breite zu tun haben. Zum einen sind das height und width zum anderen sind das clientHeight und clientWidth (wenn mans genau nimmt, kommen noch offsetHeight und offsetWidht hinzu). clientHeight und clientWidth stehen jeweils auf 250. height steht auf 300 und width auf 150. Und genau da liegt der Knackpunkt. Diese beiden Attribute geben nämlichen die Dimensionen des verwendeten Koordinatensystems innerhalb des Canvas' an. Und diese beiden Eigenschaften stimmen respektiv mit den in den HTML-Attribute width und height angebenen Werten überein. 300 und 150 sind Standardwerte, die benutzt werden, wenn die Attribute fehlen sollten.

Die Werte dienen folglich nicht ausschließlich der Präsentation (auch wenn sie als Standard herangezogen werden, wenn durch CSS keine anderen Angaben spezifiziert sind), sondern vorrangig um das Koordinatensystem festzulegen. Siehe Spezifikation.

Es gibt übrigens auch noch andere Ausnahmen, wo die Attribute width und height zu dulden und sogar nützlich sind. Bei Bildern dienen sie zum Beispiel der Rendering-Engine als Hilfestellung, um Umherspringen beim Seitenaufbau zu vermeiden.