Gerade/Ungerade Zeilen einer Tabelle

[Capone]

Hallo,

ích suche eine Variante wie ich durch eine kleine Funktion den geraden oder ungeraden Zeilen einer Tabelle eine Eigenschaft wie "bgcolor" zuweisen kann. Ich kenne diese Funktion von vielen Webseiten mit Datenbanksuche bei der die Ausgabe im Wechsel (iterativ?) erfolgt.
z.B.
gerade Zeilen Weiss und ungerade Zeilen grau.

Leider war meine Suche im Forum ergebnislos.

Meine Frage ist: Gibt es sowas bzw. kann man so etwas mit JavaScript realisieren?

Für eine Antwort wäre ich sehr dankbar.

Viele Grüße

Capone

[Snafu]

Hallo!

ích suche eine Variante wie ich durch eine kleine Funktion den geraden oder ungeraden Zeilen einer Tabelle eine Eigenschaft wie "bgcolor" zuweisen kann. Ich kenne diese Funktion von vielen Webseiten mit Datenbanksuche bei der die Ausgabe im Wechsel (iterativ?) erfolgt.
z.B.
gerade Zeilen Weiss und ungerade Zeilen grau.

Du könntest dir die Tabelle per ID holen. Alle TR Elemente Raussuchen und in einer for-Schleife jedem TD Element darin eine Hintergrundfarbe abhängig von der aktuellen TR-Zahl modulo 2.

[Snafu]

Es wäre allerdings sinnvoller dies Serverseitig zu tun und nicht im Nachhinein per JS. In CSS 3 gibt es dann soviel ich weiß einen Selektor der sowas dann leicht per CSS ohne extra Klassen möglich macht.

[Capone]

Es wäre allerdings sinnvoller dies Serverseitig zu tun und nicht im Nachhinein per JS. In CSS 3 gibt es dann soviel ich weiß einen Selektor der sowas dann leicht per CSS ohne extra Klassen möglich macht.

(falls die Antwort doppelt kommt bitte ich schon mal um Verzeihung)

Schön dass noch jemand wach ist und danke für die schnelle Antwort.

Du hast mich auf jeden Fall schon auf die richtige Suche gestossen.
hab erstmal etwas ähnliches gefunden.

<script type="text/javascript">
var Farben = new Array("#CCFFCC", "#CCCCFF", "FFCCCC", "FFCCFF", "FFFFCC");
for (var i = 0; i < document.getElementsByTagName("td").length; i++) {
  var index = parseInt((Math.random() * 100) % (Farben.length - 1));
  document.getElementsByTagName("td")[i].bgColor = Farben[index];
}
</script>

Ich werde das ganze mal Versuchen umzubauen und bei Erfolg wieder posten.

Wenn jemand schneller ist dann her damit :)

Viele Grüße

Capone

[Snafu]

Wenn jemand schneller ist dann her damit :)

Es heisst nicht umsonst SELFHTML ;)
Vl ist es einfach meine persönliche Einstellung aber selbst wenn ich irgendetwas fertiges gefunden habe wollte ich es verstehen und mir dann selber etwas eigenes bauen. Das mache ich zum Teil heute noch anstatt bei irgendetwas anderem ein paar sachen zu deaktivieren.
Ausserdem habe ich mir verschiedene Lösungswege besser gemerkt wenn ich sie selber geschrieben habe und konnte dann abweichende Varianten davon anderso verwenden.
Naja, so gehts mir halt. Vl bist du da anders :)

Wenn du Probleme hast einfach posten aber du solltest schon verstehen was der Code macht.

[Capone]

Wenn jemand schneller ist dann her damit :)
Es heisst nicht umsonst SELFHTML ;)
Vl ist es einfach meine persönliche Einstellung aber selbst wenn ich irgendetwas fertiges gefunden habe wollte ich es verstehen und mir dann selber etwas eigenes bauen. Das mache ich zum Teil heute noch anstatt bei irgendetwas anderem ein paar sachen zu deaktivieren.
Ausserdem habe ich mir verschiedene Lösungswege besser gemerkt wenn ich sie selber geschrieben habe und konnte dann abweichende Varianten davon anderso verwenden.
Naja, so gehts mir halt. Vl bist du da anders :)

Wenn du Probleme hast einfach posten aber du solltest schon verstehen was der Code macht.

Ich weis was du meinst, aber ich bin nicht faul. Nur ich bin einfach ein dummer was das programmieren angeht.

Ich verstehe das schon soweit das ein Feld mit den Farben angelegt wird, welches durch "random" automatisch auf jedes "td" eine der farben nach Zufall legt. Das Ganze geht auch mit "tr". soweit ja kein ding da "tr" reinzuschreiben statt "td"... aber ich kann einfach keine programmierung...bin da einfach ne nulpe..habs halt mehr mit design und weniger mit mathe.

Frag mich, wieso man eine so sinnlose Variante mit bunten Zufallsspielchen als Beispiel gibt und nicht etwa einen fortlaufenden Wechsel der Zeilenhintergründe für Linklisten etc. was doch eher ein alltägliches problem darstellt

selfthtml ist ja alles richtig... aber Forum ist nun mal auch richtig.. dann könnte man das auch abschaffen, wenn man keine hilfe bekommt und vorn hin schreiben "Bitte alles selber durchlesen und lernen, wir sehen uns in 3 Jahren wieder, zur Auswertung, bis denn" *hehe :o)

...zumindest ist das Problem nicht im Forum behandelt und vielleicht suchen auch viele andere nach so einer Lösung.

Also falls jemand mehr als den Standardspruch auf Lager hat und vielleicht kurzerhand mit ner Idee zu hilfe kommen könnte, wäre ich wie gesagt sehr sehr sehr dankbar.

grüße

Capone

[Bezkeroon]

Probiers mal hiermit:

  
function altRows()  
{  
    var oTRs = document.getElementsByTagName("tr");  
    for (var i = 0, iCount = oTRs.length; i < iCount; i+=2)  
      oTRs[i].className = "alt";  
}  

musst Dir zusätzlich noch eine css-Klasse definieren.
zum Beispiel:

  
tr.alt {background-color: #CCC;}  

dann das ganze zum Beispiel beim onload aufrufen.
Jede zweite Zeile (beginnend mit der ersten) bekommt dann die definierte CSS-Klasse zugewiesen. Alle anderen Zeilen bleiben wie sie waren.

Grüße

Bezkeroon

[Capone]

Probiers mal hiermit:

function altRows()
{
    var oTRs = document.getElementsByTagName("tr");
    for (var i = 0, iCount = oTRs.length; i < iCount; i+=2)
      oTRs[i].className = "alt";
}

>   
>   
> musst Dir zusätzlich noch eine css-Klasse definieren.  
> zum Beispiel:  
>   
> ~~~css
  

> tr.alt {background-color: #CCC;}  
> 

dann das ganze zum Beispiel beim onload aufrufen.
Jede zweite Zeile (beginnend mit der ersten) bekommt dann die definierte CSS-Klasse zugewiesen. Alle anderen Zeilen bleiben wie sie waren.

Grüße

Bezkeroon

da ist mein Retter in der Not :) ich muss sagen ich bin begeistert.

Funktioniert wunderbar. endlich ein Ausweg aus dieser Nerverei mit den bgColor-geschichten! Wirklich tausend Mal danke!!!!!!!

Ich verspreche ich werde mich javascript die nächsten wochen und monate auseinandersetzen und dann nicht nerven sondern mithelfen, soweit ich kann.

Viele grüße

Capone

[rfb]

Moin

Funktioniert wunderbar.

...

Ich verspreche ich werde mich javascript die nächsten wochen und monate auseinandersetzen ...

ich hoffe du findest bei dieser Beschäftigung auch ein paar Hinweise auf die Probleme, die jene User, die über kein JavaScript verfügen, mit solchen Scripten haben.

Gruß
rfb

[Capone]

Moin

Funktioniert wunderbar.
...
Ich verspreche ich werde mich javascript die nächsten wochen und monate auseinandersetzen ...

ich hoffe du findest bei dieser Beschäftigung auch ein paar Hinweise auf die Probleme, die jene User, die über kein JavaScript verfügen, mit solchen Scripten haben.

Gruß
rfb

ich werds versuchen, bis dahin werden jene wohl an dieser Stelle eine normale weiße Tabelle sehen und sich so durch die Zeilen "durchwurschteln" um nach den für sie interessanten Links zu suchen :P
ich denke aber eine Lösung des JavaScript-problems wäre dann wohl nur durch Sprachen wie z.B. PHP möglich. und diese müssen ja serverseitig lauffähig sein. (kostet mich der webspace auch mehr)

mir ging es jetzt um eine Lösung die man im HTML einbetten kann ohne "große" Umstände für ein "eigentlich" kleines Problem für dass ich jedoch trotzdem zu dumm bin. deshalb an der stelle noch mal Danke!

grüße

Capone

[Bezkeroon]

bitte bitte, kein Problem

[rfb]

Moin

ich denke aber eine Lösung des JavaScript-problems wäre dann wohl nur durch Sprachen wie z.B. PHP möglich. und diese müssen ja serverseitig lauffähig sein. (kostet mich der webspace auch mehr)

dies Problem ließe sich schon lösen durch JavaScript und CSS. Beispiel: im CSS allen tr einen Rahmen geben und diesen per JavaScript entfernen. Schon muss niemand mehr - selbst bei deaktiviertem JavaScript - in der weißen Wüste seinen Pfad suchen.

Gruß
rfb