✔ CSS - STYLE in DIV schreiben

[MS-Killer]

Servus Javascript/AJAX-Profis,

habe folgendes Problem:

Ich schreibe in ein DIV:
document.getElementById("NAME des DIV").innerHTML=WERT;

das geht auch ohne Problem nur wenn ich einen STYLE in das DIV schreiben will,
werden diese Werte nicht eingetragen!

Sobald ich vor den Werten < s t y l e > und danach < / s t y l e > schreibe werden diese im IE nicht in das DIV eingetragen oder im FF stoppt die Aktion!

Gibt es eine Möglichkeit wie ich mit Javascript ein CSS dynamisch erzeuge und dieses dynamisch im Dokument als Vorschau anzeigen kann?

 

[Maik]

Hi,

versuch es mal so:

document.getElementById("NAME des DIV").innerHTML=WERT;
document.getElementById("NAME des DIV").style.[Style-Eigenschaft]=Eigenschaftswert;

Siehe hierzu auch http://de.selfhtml.org/javascript/objekte/style.htm

 

[MS-Killer]

Danke Maik für Deine schnelle Antwort.

Mir ist der Befehl bekannt nur möchte ich in den DIV folgendes schreiben z.B.:

<style>
.imgLEFT{
margin: 9px 5px 5px 5px;
float: none;
float: left
}

.imgRIGHT{
margin: 9px 5px 5px 5px;
float: none;
float: right
}
</style>

Die Bilder die dann in der Vorschau zu sehen sind sollen dann immer auf imgLEFT oder auf imgRIGHT zugreifen. Das geht auch wenn der Wert schon drinnen steht nur wenn ich den CSS mit Javascript in das DIV schreibe geht es nicht mehr.

Meine Frage ist nun ist es möglich in ein DIV ein CSS mit "<style> WERTE </style>"zu schreiben oder ist es nicht erlaubt/möglich dies gesamt zu erzeugen und an ein DIV zu übergeben?

 

[MS-Killer]

IE 6 & IE 7scheint nicht in der lage zu sein ein <style> WERT </style> in ein DIV zu schreiben - dieser DIV erscheint nach dem schreiben immer als LEER.

Im FF Version 2 gibt es keine Probleme damit!

Warum das so ist geht mir nicht auf!

 

[hela]

Hallo MS-Killer,

es ergibt ganz einfach keinen Sinn, was du da machen willst.
Wenn ich ein Browser wär, dann wurde ich mich auch weigern so was zu tun.

Ein STYLE-Element (also <style> ... </style>) gehört innerhalb eines HTML-Dokuments in den Header. Ein DIV-Block gehört innerhalb eines HTML-Dokumentes aber in den Body.Aufbau und Struktur eines HTML-Dokumentes kennst du sicherlich.

Wenn du nun die Style-Eigenschaften eines Elementes im Body verändern möchtest, dann kannst du nicht einfach ein Style-Element per "innerHtml" in das betreffende Element schreiben. Das macht man eben auch nicht, wenn man ganz normal eine HTML-Datei "mit der Hand" schreibt. Du kannst die Style Eigenschaften eines HTML-Elementes per JavaScript ändern, so wie Maik das oben beschrieben hat. Hast du dir den dabeistehenden Link mal richtig angesehen? Vielleicht wird dir dann alles klar.

 

[MS-Killer]

Servus Hela,
ja ich kenne die style-Anweisungen und den Link von Maik.

Und richtig man setzt keine CSS in ein DIV das sich im BODY befindet,
lustig ist nur wenn es dort ist wird es verwendet -
wenn es mit Javascript via
innerHTML übergeben wird ist es => LEER!

Es währe eine schnelle und bequeme Lösung wenn es doch gehen würde,
da mein Grund-Code in JS ca. 280 KB groß ist!

Die Lösung:
Ich lege jetzt eine Grundwert im CSS fest und änder diesen dann via
document.all.BILDNAME.style.margin= WERT1+'px '+ WERT 2+'px '+ WERT3'px '+ WERT4+'px;';
der zweite Wert wird in ein <input type="hidden" id="WERT" value="" name="WERT"> für die spätere Übermittlung übergeben.

Es ist hierfür gedacht: DEMO

 

[Sven Mintel]

Es liegt nicht daran, wo das <style>-Element steht(selbst bei tutorials.de stehen die Stylesheets z.T. Querbeet im Dokument )

Es liegt daran, dass es nach dem Laden der Seite hinzugefügt wird...der Browser interessiert sich später nicht mehr dafür...ähnlich wie bei nachträglich hinzugefügtem Skriptcode.

Wie man ihn dazu bringt, doch nochmal in den Styles nachzuschauen, steht hier: http://forum.de.selfhtml.org/archiv/2004/3/t74179/

 

[MS-Killer]

Servus Sven Mintel,
oder BINGO!

W3C kann getrost ignoriert werden - Richtlinien wozu ;-)?

Zeigt uns doch jede bessere Erotik-Page was an Cross-Coding nicht erlauft ist und dennoch geht!

Tutorials.de => CSS- und JS- Fehler ja es gibt einige aber wichtig ist das diese Seite eine der wenigen im Web ist die hilfreich ist - hat mir schon oft in den letzten Jahren den richtigen Gedankenanstoß gegeben (wenn das Hirn mal nicht wollte)!

Wollte zuerst mit getElementsByClassName() arbeiten.

Danke für den Link ist sehr nützlich… (für die Zukunft)

 

[hela]

@MS-Killer:
Tut mir leid: Ich dachte dein Alias-Name sei Programm und konnte nicht ahnen, dass du nach einer standardwidrigen MS-Lösung suchst.
Und genau das macht für mich keinen Sinn, weil niemand weiss ob das übermorgen noch funktioniert.

@Sven:
So sehr ich deine Beiträge auch schätze, aber in der Dokumenttypdeklaration von tutorials.de ist eine DTD expressiv angegeben. Deine obige Bemerkung könnte man nun so interpretieren, dass es dir eine Freude ist sich nicht daran zu halten.

 

[Sven Mintel]

Nö, keineswegs.... ich wollte damit nur feststellen, dass ein fehlerhaftes Dokument nicht gezwungenermassen ein Grund für einen Fehler sein muss.
Es bietet ja auch in dem hier erörterten Fall keinen Vorteil, das CSS an falscher Stelle einzubinden...denn dem Browser ist es gleich, wo es steht...also warum nicht dort, wo es hingehört.

Diesen "Fehler" im Forum abzuändern liegt leider nicht so recht in unserer Macht, er tritt beim Einbinden der Editoren durch die Forensoftware auf...da fummeln wir lieber nicht dran rum