Variable in einem style aufrufen

[Sebastian]

Hallo,

ich habe denke ich ein ganz einfaches Problem, allerdings bekomme ich es leider nicht hin.

Ich habe einen counter mit JavaScript, und ich möchte das bei bestimmten werte die Hintergrundfrabe eines Tabellenfeldes geändern wird...

Leider geht es nicht..

.
.
.

<script type="text/javascript">

if(counter == 20 || counter == 24){

hintergrundFarbe = "#DDDDE0"

}

</script>

<td valign="top" class="$Style1" nowrap

#if ($Style1 == "plan1")

style="background-color:<script type="text/javascript">hintergrundFarbe</script>;"

.
.
.

Wie es aussieht darf ich in dem sytle nicht einfach meine JavaScript Variable aufrufen...

Hat da jemand eine Idee?? Danke!

[plan_B]

Hallo,

Wie es aussieht darf ich in dem sytle nicht einfach meine JavaScript Variable aufrufen...

Hat da jemand eine Idee?? Danke!

[#231] http://de.selfhtml.org/javascript/objekte/style.htm@title=javascript/objekte/style.htm

Gruß plan_B

[molily]

Hallo,

JavaScript ist kein Präprozessor wie PHP; keine Programmiersprache, die HTML-Dokumente durch einzelne Code-Ausgaben generiert. (Das ist zwar möglich, sollte aber die Ausnahme bleiben.)

Wenn du HTML-Code generieren willst, solltest du auch eine serverseitige Sprache wie PHP o.ä. verwenden. JavaScript stellt eine Interaktivität des HTML-Dokuments zur Verfügung, wenn es im Browser angezeigt wird. Man spricht auch von der Verhaltens-Schicht, die von der Schicht der Datenstruktur (HTML) und der Präsentation (CSS) getrennt sein sollte. In deinem Code wird alles vermischt - das ist weder sinnvoll noch letztlich möglich.

Wenn du einfach nur gewissen Tabellenzellen gewisse Klassen geben willst, hat das wenig mit browser-seitiger Interaktivität zu tun und JavaScript ist dann nicht das Mittel der Wahl - es sei denn, dein »Counter« wird immer wieder durch Benutzereingaben neubestimmt, die auf der Serverseite unbekannt sind. Daher: Was hat es denn mit dem Counter auf sich?

Was du mit JavaScript machen kannst, ist nachträglich an das DOM des Dokuments zu gehen und dort Veränderungen vorzunehmen, also auch Elementknoten Klassen hinzufügen. Dazu musst du die fraglichen Elementknoten eindeutig ansprechen können (z.B. über IDs über document.getElementById) und kannst dann die Eigenschaft className ändern.

HTML (Struktur):
<td id="bestimmteTabellenzelle">...</td>

CSS (Präsentation):
td.hervorgehoben { color: #DDDDE0; }

JavaScript (Verhalten - naja, das ist die Frage):
document.getElementById("bestimmteTabellenzelle").className = "hervorgehoben";

Den Code muss man in einer Funktion ausführen, die erst dann gestartet wird, wenn das Dokument vollständig geladen ist und der Zugriff auf das DOM möglich ist. Das geht über onload:

function init () { ... }  
window.onload = init;

Aber wie gesagt ist die Frage, ob JavaScript das Mittel der Wahl ist, denn welchen Sinn hat es, eine solche feste Operation mit JavaScript durchzuführen, zumal es so kompliziert ist?

Mathias