getElementsByTagName

[lixx]

Hallo!

Ich verwende zur Darstellung von Tabellen eine abgeänderte Version von dem Javascript aus phpMyAdmin um die Zeilen hervorzuheben, sobald man über sie darüberfährt.

function setRowPointer(obj, io) {

var theCells = obj.getElementsByTagName('th');
 var newColor = (io) ? roRowColor[0] : roRowColor[1];

// DOM compatible browsers except Opera else with other browsers
 (typeof(window.opera) == 'undefined' && typeof(obj.getAttribute) != 'undefined') ?
  domDetect = true : domDetect = false;

for (var i=0; i<theCells.length; i++) {
  (domDetect) ?
   theCells[i].setAttribute('bgcolor', hexCalc(theCells[i].getAttribute('bgcolor'), newColor), 0) :
   theCells[i].style.backgroundColor = hexCalc(theCells[i].getAttribute('bgcolor'), newColor);
 }
}

Nun habe ich folgendes Problem: In meinen Tabellen kommen in den Zeilen nicht nur td's sondern auch th's vor. Ersetze ich nun die Zeile

var theCells = obj.getElementsByTagName('td');

gegen

var theCells = obj.getElementsByTagName('th');

passiert nix mehr. Sprich die th-Zellen werden nicht gehighlited. Die Javascript-Fehler Konsole sagt nichts und alert(theCells); gibt wie es soll ein HTML-Objekt aus. Woran kann das liegen?

Hoffe da weiss jemand bescheid.

lg lixx

[Rouven]

Hello,

function setRowPointer(obj, io) {

was ist hier der Einstiegspunkt? Vielleicht ein tbody, was für th ein thead sein müsste?

MfG
Rouven

[lixx]

function setRowPointer(obj, io) {
was ist hier der Einstiegspunkt? Vielleicht ein tbody, was für th ein thead sein müsste?

Weiß nicht genau was du damit meinst. Das th-Element beziht sich auf die Zeile und auch ohne tbody funktioniert es nicht. Die Tabellenstruktur ist so:

<table ... rules="groups">
<caption>...</caption>
<colgroup><col width="0*" /><col width="100%" /></colgroup>
<tbody>
<tr onmouseover="javascript: setRowPointer(this, 1);" onmouseout="javascript: setRowPointer(this, 0);">
<th ... scope="row">...</th>
<td>...</td>
</tr>
</tbody>
</table>

lg lixx

[Gernot Back]

Hallo lixx,

warum gibst du nicht einfach deinen TR-Elementen onmouseover eine neue Klasse (entziehst sie wieder onmouseout) und gibst über dein Stylesheet mit dem den Nachfahrensselektor deren Kindern, egal ob TH- oder TD-Elementen die gewünschte Farbe?

Gruß Gernot

[lixx]

warum gibst du nicht einfach deinen TR-Elementen onmouseover eine neue Klasse (entziehst sie wieder onmouseout) und gibst über dein Stylesheet mit dem den Nachfahrensselektor deren Kindern, egal ob TH- oder TD-Elementen die gewünschte Farbe?

Wäre eine Möglichkeit. Aber die Funktion soll auf alle Tabellen anwendbar sein. Sprich: es gibt mehrere Hintergrundfarben. und mit dieser Funktion wird die Hintergrundfarbe einfach um rgb(20,20,20) abgedunkelt und wieder aufgehellt.

lg lixx

[lixx]

Danke für die Antworten!

warum gibst du nicht einfach deinen TR-Elementen onmouseover eine neue Klasse (entziehst sie wieder onmouseout) und gibst über dein Stylesheet mit dem den Nachfahrensselektor deren Kindern, egal ob TH- oder TD-Elementen die gewünschte Farbe?

@Gernot
Wäre eine Möglichkeit. Aber die Funktion soll auf alle Tabellen anwendbar sein. Sprich: es gibt mehrere Hintergrundfarben. und mit dieser Funktion wird die Hintergrundfarbe einfach um rgb(20,20,20) abgedunkelt und wieder aufgehellt.

@Rouven

function setRowPointer(obj, io) {
was ist hier der Einstiegspunkt? Vielleicht ein tbody, was für th ein thead sein müsste?

Weiß nicht genau was du damit meinst. Das th-Element beziht sich auf die Zeile und auch ohne tbody funktioniert es nicht. Die Tabellenstruktur ist so:

<table ... rules="groups">
<caption>...</caption>
<colgroup><col width="0*" /><col width="100%" /></colgroup>
<tbody>
<tr onmouseover="javascript: setRowPointer(this, 1);" onmouseout="javascript: setRowPointer(this, 0);">
<th ... scope="row">...</th>
<td>...</td>
</tr>
</tbody>
</table>