Ottokar Wandelpunkt: übergebene Variable als style an html-Elemet hängen

Beitrag lesen

<span id="myid" style="position:absolute; visibility:hidden;"></span>

sollte es so einfach sein ??

Ja und nein. Erstmal ist das style-Attribut grundsätzlich fehl am Platze. CSS-Angaben solltest du, so es irgend geht, immer separat halten, zumindest in einem <style>-Block, besser noch in einer CSS-Datei.
Gerade bei Elementen mit id ist es doch ein Leichtes, sie CSS-seitig mit #myid {position:absolute; visibility:hidden;} zu bestücken.

In deinem speziellen Fall schaffst du dir mit dem style-Attribut zudem noch ein Problem. Es wäre einfach:

var myCssStuff = "font-weight:bold"; // eigentlich deine Funktion

var mytext = document.getElementById("myid"); 
mytext.style = myCssStuff;

Es ist bei dir aber nicht einfach, weil .style nicht irgendein Attribut ist, sondern in dieser Form identisch mit dem style-Attribut in HTML. Nach dem Ausführen des obigen Javascript-Schnippsels steht in deinem HTML-Code de facto dieses:

<span id="myid" style="font-weight:bold"></span>

Dir geht also die ursprüngliche style-Information verloren, da du sie Javascript-seitig mit der Zuweisung an .style überschreibst.

Einfach ist es hingegen, wenn du dir angewöhnst, wie eingangs beschrieben, vom HTML-style-Attribut die Finger zu lassen. Lagere die CSS-Daten, die du jetzt noch im HTML-Code stehen hast, in ein Stylesheet aus, da, wo sie hingehören – dann kannst du problemlos mittels Javascript CSS-Daten an .style zuweisen, ohne die Vorgaben zu überschreiben.

Davon unabhängig solltest du dir überlegen, ob du dem Element statt eines CSS-Wertes nicht lieber eine Klasse zuweisen und dein font-weight:bold in eine Klasse in einem Stylesheet auslagern möchtest, wie es Felix schon beschrieben hat. In Javascript hat CSS nämlich ebensowenig zu suchen wie in HTML.