<td>-Tag formatieren
chuckie
- javascript
Hallo zusammen,
hat jemand eine Ahnung, wie ich per JS ein <td>-Tag aus einer Tabelle nachträglich per CSS formatieren kann?
Dabei will ich in den Templates allerdings immer nur das letzte <td>-Tag eines <tr>-Blocks formatieren.
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
z.B. könnte man dem letzten ein Inline-Style anhängen
<td style=".."></td>
oder einfach eine Klasse?
<td class=".."></td>
Habe mich schon dumm und dämlich gesucht, wie man so eine Abfrage einbaut, allerdings habe ich nichts wirklich richtiges gefunden. Bin leider auch nicht so der JS-Profi.
Viele Dank für Eure Tipps,
Grüße
Hi,
hat jemand eine Ahnung, wie ich per JS ein <td>-Tag aus einer Tabelle nachträglich per CSS formatieren kann?
Gib ihm eine Klasse - damit kannst du Scriptlogik und Darstellungsinformation am sinnvollsten trennen.
MfG ChrisB
@@chuckie:
nuqneH
hat jemand eine Ahnung, wie ich per JS ein <td>-Tag aus einer Tabelle nachträglich per CSS formatieren kann?
Wieso per JS? Wieso nachträglich?
z.B. könnte man dem letzten ein Inline-Style anhängen
<td style=".."></td>
Nein, pfui!
oder einfach eine Klasse?
<td class=".."></td>
Ja, aber wozu? Genau dafür gibt es die Pseudoklasse :last-child.
Für IE per CSS-Expression, s. dortige Links.
Qapla'
Vielen Dank für den Tipp!
Habe mir jetzt überlegt, aufgrund der Browserkompatibilität, die :first-child Pseudoklasse zu verwenden.
Dabei will ich von meinem ersten <td>-Tag das Hintergrundbild ausstellen (background:none).
Bisher habe ich das im CSS so gelöst:
table td {
background:url(../images/v-line.gif) left top no-repeat;
}
table td:first-child {
background:none;
}
Klappt wunderbar in den guten Browsern.
Für die CSS-Expression im IE, habe ich mir Deine Dokumentationen angeschaut und habe folgendes dabei rausbekommen.
* html table td {
background: expression( (function (element) { element.style.background = (element.parentNode.previousSibling ? "none" : "url(../images/v-line.gif) left top no-repeat"); })(this) );
}
Leider will es noch nicht funktionieren. Weißt Du, wo der Fehler liegen könnte?
(Habe es einfach in das CSS-Dokument geschrieben und keine Reihenfolge beachtet, nicht schlimm oder?)
Danke und viele Grüße!
@@chuckie:
nuqneH
hat jemand eine Ahnung, wie ich per JS ein <td>-Tag aus einer Tabelle nachträglich per CSS formatieren kann?
Wieso per JS? Wieso nachträglich?
z.B. könnte man dem letzten ein Inline-Style anhängen
<td style=".."></td>
Nein, pfui!
oder einfach eine Klasse?
<td class=".."></td>
Ja, aber wozu? Genau dafür gibt es die Pseudoklasse :last-child.
Für IE per CSS-Expression, s. dortige Links.
Qapla'
@@chuckie:
nuqneH
table td:first-child {
background:none;
}Klappt wunderbar in den guten Browsern.
Und auch im IE 7, der wohl kaum in die Kategorie fällt.
Für die CSS-Expression im IE
Du meinst 6er abwärts? Wozu willst du die noch berücksichtigen? Vorwärts in die Vergangenheit?
Wenn die Darstellung für Höhlenmenschen mit steinzeitlichen Werkzeugen (Faustkeil und IE 6) nicht optimal ist, werden die nicht lautstark „Wiiil-maaa!“ rufen. (Und wenn doch, kann man dies getrost überhören.)
habe ich mir Deine Dokumentationen angeschaut
Auch verstanden?
und habe folgendes dabei rausbekommen.
* html table td {
background: expression( (function (element) { element.style.background = (element.parentNode.previousSibling ? "none" : "url(../images/v-line.gif) left top no-repeat"); })(this) );
}Leider will es noch nicht funktionieren. Weißt Du, wo der Fehler liegen könnte?
Ja, bei 'parentNode'.
Für IE per CSS-Expression, s. dortige Links.
Autsch, ich wollte eigentlich dieses Posting in dem Thread verlinken.
Qapla'
PS: Bitte kein TOFU!