Jquery Selektor für alle <td> in einem <tbody> gesucht

[Regenbogenjonny]

Hallo,

$('#tbody_' + my_id[1] + 'td').css('background-color', 'blue');

sollte (dachte ich) alle <td> Elemente finden, die innerhalb eines <tbody>-Elementes sind, das die ID tbody_1234 (der ID-Anhang ist nur ein Beispiel für die aktuelle tbody-Zeilennummer) trägt.

Aber die Zeilen/Zellen innerhalb des tbodys ändern ihre Farbe nicht.

Wo liegt mein Fehler?

Jonny

[MudGuard]

Hi,

$('#tbody_' + my_id[1] + 'td').css('background-color', 'blue');

wenn my_id[1] = 1234 ist, steht da $('#tbody_1234td')

Siehst Du jetzt selbst, was Du nicht siehst?

Wo liegt mein Fehler?

In der fehlenden Leere.

cu,
Andreas a/k/a MudGuard

[dedlfix]

Tach!

$('#tbody_' + my_id[1] + 'td').css('background-color', 'blue');

wenn my_id[1] = 1234 ist, steht da $('#tbody_1234td')

Siehst Du jetzt selbst, was Du nicht siehst?

Abgesehen vom fehlenden Leerzeichen sagt mit der Assistent vom PhpStorm immer, dass man solche Dinge lieber zweiteilig sucht, weil dann wohl der erste Teil schneller gefunden werden kann und die Suche nach dem zweiten sich nur noch auf ein kleines Gebiet erstreckt.

$('#tbody_' + my_id[1]).find('td').css(...)

Und dann wird auch gleich noch der Herr Bittersmann einwenden, dass man besser keine CSS-Eigenschaften direkt setzt, sondern die Klasse ändert (durch hinzufügen, löschen oder umschalten) und die notwendigen CSS-Anweisungen in den CSS-Dateien regelt.

dedlfix.

[Regenbogenjonny]

wenn my_id[1] = 1234 ist, steht da $('#tbody_1234td')

Siehst Du jetzt selbst, was Du nicht siehst?

Ja, sehe ich :-)

Abgesehen vom fehlenden Leerzeichen sagt mit der Assistent vom PhpStorm immer, dass man solche Dinge lieber zweiteilig sucht, weil dann wohl der erste Teil schneller gefunden werden kann und die Suche nach dem zweiten sich nur noch auf ein kleines Gebiet erstreckt.

$('#tbody_' + my_id[1]).find('td').css(...)

Funktioniert jedenfalls, genau wie obiges inkl. leerzeichen, prima.

Frage hierzu: Kann ich auch nur genau 1.td-Ebene tiefer selektieren? Ich habe nämlich innerhalb der td noch weitere Tabellenebenen. Ich würde aber gerne nur das direkt unterhalb des tbody tr/td ansprechen.

Und dann wird auch gleich noch der Herr Bittersmann einwenden, dass man besser keine CSS-Eigenschaften direkt setzt, sondern die Klasse ändert (durch hinzufügen, löschen oder umschalten) und die notwendigen CSS-Anweisungen in den CSS-Dateien regelt.

Ja, habe ich hier schon öfter gelesen (und ignoriert). Ich unterscheide hier, ob es wiederverwendbar sein muß (für mich) oder wirklich (wie in diesem Fall) ein Einzelfall ist.

Jonny

[Gunnar Bittersmann]

@@Regenbogenjonny

Frage hierzu: Kann ich auch nur genau 1.td-Ebene tiefer selektieren?

Ja, kannst du: mit dem Kindselektor. Beachte, dass td nicht Kind von tbody ist, sondern noch eine Generation dazwischen ist.

Ich habe nämlich innerhalb der td noch weitere Tabellenebenen.

Das hört sich nicht gut an. Was für Daten rechtfertigen verschachtelte Tabellen? Oder missbrauchst du Tabellen zum Layouten?

LLAP 🖖

[Regenbogenjonny]

Das hört sich nicht gut an. Was für Daten rechtfertigen verschachtelte Tabellen? Oder missbrauchst du Tabellen zum Layouten?

Wie mans nimmt: Ich "wiederverwende" Code. Aber es passt schon: Es sind tabellarische Aufführungen innerhab einer tabellarischen Aufführung. Glaubs oder nicht: Sowas gibts.

Jonny

[dedlfix]

Tach!

Abgesehen vom fehlenden Leerzeichen sagt mit der Assistent vom PhpStorm immer, dass man solche Dinge lieber zweiteilig sucht, weil dann wohl der erste Teil schneller gefunden werden kann und die Suche nach dem zweiten sich nur noch auf ein kleines Gebiet erstreckt.

$('#tbody_' + my_id[1]).find('td').css(...)

Funktioniert jedenfalls, genau wie obiges inkl. leerzeichen, prima.

Natürlich funktioniert das auch mit Leerzeichen. Und es gibt noch andere Methoden, die ebenfalls effektiv sind. Man darf sich aber auch mal die Frage stellen, welche Lösungen effizienter sind. Bei nur einer Verwendung ist es ziemlich egal. Man kann aber auch mal die Performance-Tipps berücksichtigen: jQuery-Dokumentation: Optimize Selectors.

dedlfix.

[Gunnar Bittersmann]

@@dedlfix

Und dann wird auch gleich noch der Herr Bittersmann einwenden, dass man besser keine CSS-Eigenschaften direkt setzt, sondern die Klasse ändert (durch hinzufügen, löschen oder umschalten) und die notwendigen CSS-Anweisungen in den CSS-Dateien regelt.

Warum sollte ich das tun?

Betonung nicht auf „tun“, sondern auf „ich“.

Lassen wir’s Cheatah tun. Besser gesagt, seinen Geist, der hier immer noch durchs Forum spukt:

„Was hingegen schwer ist, ist in die Köpfe der Menschen zu bringen, dass Layout-Informationen in den CSS-Code gehören, nicht in den JavaScript-Code. JavaScript ist wunderbar geeignet, die DOM-Objekte auf eine Weise zu verändern, die in CSS genutzt werden kann.“
(Quelle: Zitatesammlung)

LLAP 🖖