Suche html Befehl für meine Seite

[René Friese]

Hallo !

Ich stehe vor einem Problem.

Ich habe eine Webseite, worauf eine Tabelle mit 2 Spalten und vielen Zeilen ist.

Diese beinhaltet immer links Datum / Wochentag und rechts den Termin.

Nun möchte ich das jede zweite Zeile gelb hinterlegt ist, die anderen Zeilen sind wie der Seitenhintergrund.

Wenn ich einen Termin jedes mal einfüge, rutscht eine Zeile dazwischen.

und dann stimmt die Hintergrundfarbe nicht mehr, entweder habe ich zwei gleichfarbige Zeilen, oder aber ich darf bis zur letzten Zeile die Farbangabe korrigieren.

Das macht viel Arbeit und ich füge zu oft Termine nach.

Wie kann ich mittels html oder java erreichen das die Tabelle immer jede Zeile abwechselnde Farben hat ?

Bitte nicht mit php, cgi oder sowas, abgesehen davon das ich davon kaum Ahnung habe und auch kein cgi Verzeichnis mehr habe, dauert mir die Ladezeit immer zu lange.
Wenn ich auf manche Webseiten das sehe wie lange da Daten geladen werden.

Ich möchte das möglichst per html haben.

Habe ich da eine Möglichkeit ???

[Christian Marquardt]

Automatisch: gar nicht

HTML ist keine Programiersprache. somit kann du dort auch keine Programmstrukturen (Befehle usw.) hinterlegen.

Da du Zeilen an belieger Stelle in der Tabelle einfügst, bleibt dir wohl nur ein Lösung mit JAVA.

Es erstaunt mich aber, dass du keine PERL,PHP Lösung möchtest, aber mit JAVA. Ohne Kenntnisse in CGI wirst du wohl JAVA nicht anwenden können. Die Parameter für JAVA werden auch per CGI (CommonGatewayInterface) übertragen. CGI ist keine Programmiersprache sondern eine Schnittstelle. Weiterhin ist erstaunlich, dass du kein Zugriff auf CGI-Skripte hast, aber offenbar JAVA auf deinem Webserver ablauffähig ist.

Das ganze kann aber mit einen gutem HTML-Editor vereinfacht werden, der Macros beherrscht (Z.B. HOTMETAL) dann kannst du deine Tabelle entwerfen und die Farben der Zeilen per Macro ändern. Das ist dann nur noch ein geringer Aufwand

[René Friese]

Hallo Christian,

Perl PHP und CGI konnte ich einsetzen auf meinem alten Webspace.

Ich habe auch einmal ein CGI zum laufen bekommen, nach ewigen fummeln, bin eben nicht so konfirm drin.

Nun habe ich aus Kostengründen - ein Sponsor findet sich ja nicht - einen billigeren Tarif ohne CGI genommen da ich es eigentlich nicht brauche für meine Page.
Auch keine 300 MB wenn meine und die meiner Frau zusammen nur 21 MB ausmachen...

Perl, oder CGI schreibe ich selbst überhaupt nicht.

Bei Java gibt es so zwei Sachen glaub ich das verwechsle ich immer.
Also ich habe Java Script auf meinen Webseiten eingesetzt.

Das ist wahrscheinlich wieder etwas anderes.

Kannst Du mir helfen mit einem Java Script das ich einsetzen könnte dafür ?

Ren&#233

[Christian Marquardt]

Ja, JavaScript kannst du dafür einsetzen.

Grundsätzliches vorgehen:

Im Head-Bereich des HTML-Dokuments in einem Array alle Daten der Tabelle vorrätig halten.

Sind Änderungen werden die Daten in diesem Array geändert oder hinzu-(zwischen durch ein-) gefügt.

An der Stelle im HTML-Dokument wo die Tabelle erscheinen soll, wird diese zur Laufzeit dynamisch erzeugt(document.write("TABLE....")

Dabei wird der Farbwechsel bei jeder Zeile berücksichtigt.

Ein fertiges Script habe ich nicht. Wie gesagt ist der Aufwand geringer mit einem guten HTML-Editor

[Mathias Simmack]

Hallo.

Ich habe eine Lösung ). Allerdings setzt meine Lösung eine bestimmte Syntax der Termine voraus, ist dafür im Gegenzug allerdings unabhängig von irgendwelchen Längenangaben.
Na dann mal los -

Zuerst brauchst du ein Array, in dem du die Termine definierst. Mein Vorschlag sieht so aus:

<PRE>
&lt;script language=&quot;JavaScript&quot;&gt;&lt;!--<br>
var Termine = new Array(&quot;Montag, 18. Februar 2002|Heute ist nichts los!&quot;,
&quot;Dienstag, 19. Februar 2002|Heute hat mich meine Frau verlassen.&quot;,
&quot;Mittwoch, 20. Februar 2002|Sie will die Scheidung.&quot;,
&quot;Donnerstag, 21. Februar 2002|Meine neue Freundin ist erst 20!&quot;,
&quot;Freitag, 22. Februar 2002|) Mir fallen keine dummen Spr&amp;uuml;che mehr ein!&quot;
//--&gt;&lt;/script&gt;
</PRE>

Die Pipe (der senkrechte Strich) dient als Trennzeichen für Wochentag/Datum und den eigentlichen Termintext. Du kannst es auch mehrmals benutzen, aber das erste gefundene Zeichen dieser Art dient später als Referenz zum Trennen.
Da es sich um JavaScript in Verbindung mit HTML handelt, solltest du Umlaute und Sonderzeichen in ihrer HTML-Form benutzen (s. Freitag). Und wenn du Anführungszeichen benötigst, dann stelle ihnen einen Backslash voran, etwa

<PRE>
"Samstag, 23. Februar 2002|<b>\</b>"Simmis<b>\</b>" Vorschlag funktioniert!"
</PRE>

Das wäre wichtig, ansonsten meckert der Browser beim Ausführen des Skriptes.
So, jetzt zum eigentlichen Skript:

<PRE>
&lt;script language=&quot;JavaScript&quot;&gt;&lt;!--<br>
var ColorSwitch = 0;
var ColumnColor = new Array(document.bgColor, // aktuelle Dokument-Hintergrundfarbe
&quot;#ffff00&quot; // gelb<br>
document.write(&quot;&lt;table border=\&quot;1\&quot; cellspacing=\&quot;0\&quot; cellpadding=\&quot;0\&quot; width=\&quot;80%\&quot;&gt;&lt;br&gt;&quot;<br>
for(i=0;i&lt;Termine.length;i++) {<br>
// aktuellen Termin vorbereiten
var m = Termine[i].indexOf(&quot;|&quot; m += 1;<br>
// und anzeigen
if(m > 0) {
document.write(&quot; &lt;tr&gt;&quot;
document.write(&quot; &lt;td width=\&quot;50%\&quot; bgcolor=\&quot;&quot; + ColumnColor[ColorSwitch] + &quot;\&quot;&gt;&quot; + Termine[i].substr(0,--m) + &quot;&lt;/td&gt;&quot;
document.write(&quot; &lt;td width=\&quot;50%\&quot; bgcolor=\&quot;&quot; + ColumnColor[ColorSwitch] + &quot;\&quot;&gt;&quot; + Termine[i].substr(++m,Termine[i].length) + &quot;&lt;/td&gt;&quot;
document.write(&quot; &lt;/tr&gt;&lt;br&gt;&quot;<br>
// Hintergrundfarbe ändern
ColorSwitch = 1 - ColorSwitch;
}
}<br>
document.write(&quot;&lt;/table&gt;&quot;<br>
//--&gt;&lt;/script&gt;
</PRE>

Das sieht nur auf den ersten Blick merwürdig aus. )<br><br>
Fangen wir oben an:

Die Variable "ColorSwitch" dient später zum Wechsel der Farben und kann nur die Werte Null und Eins annehmen.
"ColumnColor" ist ein Array, dass die aktuelle Hintergrundfarbe und das von dir gewünschte Geld enthält.

Dann wird in das aktuelle Dokument mit dem "write"-Befehl (den Christian ja schon erwähnt hat), der Anfang der Tabelle geschrieben.
Es folgt eine for-Schleife, die alle eingetragenen Termine berücksichtigt.
In dieser Schleife wird zunächst das Trennzeichen <b>|</b> gesucht, und abhängig davon wird der Text dargestellt.
Am Schluss wird der Wert der Variablen "ColorSwitch" geändert, damit die Farbe wie gewünscht wechselt.

Du kannst es gern ausprobieren und irgendwo mittendrin einen weiteren Termin einfügen.

Der einzige Nachteil ist allerdings, dass du deine Besucher darauf aufmerksam machen musst, dass sie JavaScript benötigen. Denn ohne dieses werden sie von der Tabelle nicht viel sehen. )

Gruß,
Mathias

[Christian Marquardt]

Na prima genau so geht es doc

[Marco Horn]

Du kannst die Loesung auch noch insofern verfeinern, dass Du die Tabelle in HTML aufbaust (das kann dann jeder Browser) und in einem onLoad()-JavaScript Dir die Tabelle heraussuchst (mit getElementByID() z.B.) und dann dort die einzelnen Child-Nodes - das sollten ja die TR-Elemente sein - mittels neuen StyleSheets umfaerbst. Wenn jemand JavaScript hat, ist es bunt, ansonsten einfarbig, und Du brauchst das Skript hinterher nie wieder anfassen oder mit Escape-Sequenzen arbeiten.<p>
Gruss, Marc

[Mathias Simmack]

Hallo Marco.

Das Problem bei der Sache ist aber, dass die Einträge auch aus dem Skript kommen. Das könnte u.U. Probleme mit dem Auslesen der Tabelle geben. Ich muss zugeben, ich hab´s nicht probiert. Es würde mich aber interessieren, und da du Erfahrung damit zu haben scheinst ... )

Ich würde -um bei meinem Code zu bleiben- aber soweit gehen, und die Termine in eine eigenständige JS-Datei auslagern. Damit könnte man dann den Finger von der HTML-Seite lassen und müsste lediglich eine aktualisierte Version der "Termine.js" uploaden.

Was die verschiedenen Browser angeht -
Da hast du vollkommen recht. Aber -Gott sei Dank!- sind´s hier nur normale JavaScript-Befehle, so dass man sich diverse Browserabfragen sparen kann. Ich hab´s mit dem IE5.5 und dem Mozilla getestet, aber ich denke, <b>das</b> sollte auch der Opera können. (Der neue 6er kann ja endlich verschiedene CSS-Angaben richtig darstellen.)

Gruß,
Mathias