Verwendung von Style-Attributen in JavaScript

[wisch]

Guten Tag,

Anlass ist die Antwort von Gunnar Bittersmann in einem anderen Thread:: "Der Fehler ist, überhaupt CSS-Eigenschaften direkt mit JavaScript zu ändern."

Der Anwendungsfall ist das hier schon mal diskutierte Problem mit großen HTML-Tabellen und fixierten Kopfzeilen: Fixierte Tabellen-Kopfzeile. Die Lösung soll aber so funktionieren, dass fixierte Kopf- und Fußzeilen und auch linke Spalten stehen bleiben, wenn die Tabelle an den jeweiligen Fensterrand des Browsers kommt. Beispiel: Beispiel für Tabellen mit fixierten Kopf- und Fußzeilen und Spalten.

So etwas funktioniert m.E. nur mit einem JavaScript-Listener - auch wenn ich die Diskussion bei Mozilla.org kenne: Die thead- und tfoot-Bereiche werden mit cloneNode() kopiert und dann je nach Bedarf angezeigt und positioniert. Zusätzlich müssen die Zellenbreiten manuell kopiert werden. Ich bin gerade dabei, das Ganze in hier zu beschreiben: Arbeitsstand zu fixierten Kopfzeilen etc..

Jetzt zu meinem Problem: Ich bekomme das nur vernünftig hin, wenn ich konsequent in die .style-Attribute der kopierten Nodes schreibe:

1. Anders bekomme ich die Zellenbreiten nicht stabil kopiert. Es geht nur, wenn ich style.maxWidth und style.minWidth gleichzeitig setze.
2. Die Lösung soll in der Anwendung einfach und frei von Nebeneffekten sein. Ein einfaches new TabellenHeader("Tabellen-ID"); soll reichen, um das Ganze in Gang zu bringen.

Deshalb meine Frage: Was spricht dagegen, dynamisch ermittelte Werte in .style-Attributen zu setzen? Ich habe ja, Gunnar sei Dank, verstanden, dass ich besser das hidden-Attribut verwende, um die Anzeige zu steuern (statt style.display). Aber in den anderen Fällen, inbesondere bei der Dimensionierung und Positionierung schein mir das Konzept bei den .style-Attributen ausgereifter und besser gepflegt. M.E. verändere ich auch keine Layout-Informationen, die in den CSS-Code gehören, sondern dynamisch erzeugte Elemente, die nur am hilfsweise am Bildschirm benötigt werden.

Aber ich lasse mich auch gern vom Gegenteil überzeugen.

Mit Dank und vielen Grüßen

Wilfried

[Jochen]

Guten Tag Wilfried!

Anlass ist die Antwort von Gunnar Bittersmann in einem anderen Thread:: "Der Fehler ist, überhaupt CSS-Eigenschaften direkt mit JavaScript zu ändern."

Das sollte man in der Tat vermeiden wenn es besser geht. Aber nimm was Leute dir hier raten mit einem Korn Salz.

Was spricht dagegen, dynamisch ermittelte Werte in .style-Attributen zu setzen?

m.E. nichts. Dieses Problem lässt sich nicht anders lösen.

Aber in den anderen Fällen, inbesondere bei der Dimensionierung und Positionierung schein mir das Konzept bei den .style-Attributen ausgereifter und besser gepflegt.

Beide Konzepte sind ausgereift und gut gepflegt. Aber hier liegt eine Logik vor die sich mit normalen CSS-Regeln garnicht wiedergeben läßt. Dazu wird Javascript und .style.width etc benötigt.

Ciao

Jochen

[JürgenB]

Hallo,

bei umfangreicheren CSS-Angaben nehme ich Stylesheets, die, wenn sie nur im Zusammenhang mit dem Script benötigt werden und nicht konfiguriet werden sollen, auch per Javascript erzeugt werden können. Siehe Wiki:Tabellensortierer.

Wenn aber nur einzelne Angaben dynamisch geänder werden, wie z.B. die Position, mache ich das direkt. Siehe Wiki:Random Walk 2.

Gruß
Jürgen

[Gunnar Bittersmann]

@@wisch

Anlass ist die Antwort von Gunnar Bittersmann in einem anderen Thread:: "Der Fehler ist, überhaupt CSS-Eigenschaften direkt mit JavaScript zu ändern."

Nun ja, man muss die Regeln erstmal kennen, um sie zu brechen. 😏

Was ich auch hier (figcaption scaled to full-width) und da (figure width set to intrinsic image width) mal tue.

(Huch, warum geht zweiteres im Firefox nicht mehr? Das funzte mal — ’sch schwör’s.)

Und auch dort (responsive table with custom properties set with JS), wobei dort Inhalt in style geschrieben wird, nicht Darstellung.

LLAP 🖖

[wisch]

Vielen Dank an alle, die geantwortet haben!!!

Das war sehr ermutigend. In dieser Umgebung (HTML 5 / JavaScript) fühle ich mich doch noch sehr als Anfänger 😟.

Dank und Gruß

Wilfried