Für einen konkreten Fall habe ich meine Funktionen zum CSS-Reset via Javascript etwas umgebaut. Ich brauchte eine Lösung, die auf den Aufruf der Funktion eval() verzichtet.
Hier die neue Implementierung von AddStyles ohne eval():
function AddStyles( element, styles ) { for( var k in styles ) { element.style[ k ] = styles[ k ]; } } |
Die Werte werden nun als anonymes Javascript-Objekt übergeben, was auch sehr viel übersichtlicher ist:
var obj = document.getElementById( 'myelement' ); AddStyles( obj, { 'border': '1px solid #081500', 'backgroundColor': '#906090', 'lineHeight' : '100%' }); |
Wie immer ist zu beachten, dass Bindestriche in Attributsnamen entfernt und danach groß weiter geschrieben wird. Aus “background-color” wird demnach “backgroundColor“.
Update
Die CSS-Angabe float kann nicht 1:1 übersetzt werden. Für den Firefox muß cssFloat und für den Internet Explorer styleFloat benutzt werden. Man muß nicht zwangsläufig unterscheiden und kann einfach immer beide Werte setzen.
Praktisches Snippet, sowas kann ich gerade auch brauchen.
Was mich generell am System stört ist dass die CSS und JS bezeichnungen für die Attribute nicht einheitlich sind, so muss man immer erst nachschlagen.
Die Syntax ist eigentlich sehr simpel. Schau dir nochmal den Letzten Satz meines Beitrags an.
Du kannst dir ohne Probleme eine Funktion schreiben, die aus background-color backgroundColor etc. macht. Mir sind keine Ausnahmen bekannt.Eine Funktion findest du hier.