Supportnet / Forum / Skripte(PHP,ASP,Perl...)
Kleines Problem mit DOM und FireFox
Frage
Moin!
Ich habe folgendes: In einer HTML-Seite habe ich eine Tabelle, jetzt will ich wenn ich über eine Tabellenzelle mit der Maus fahre, dass sich an andere Stelle sich die farbe eines Textes ändert. Das was ich mir gebastelt habe funktioniert, zumindest hier im Opera und Konqueror. Nur der FireFox will nicht so ganz. der meckert immer an der stelle wo steht: [b]n.style.cursor = "pointer";[/b] Der FF meint immer: n.style has no properties
Einer ein Idee woran das liegt, oder was ich falsch mache?
Die FF version die ich her habe ist die 2.0.0.10
MfG
Hier Ist noch ein stück Quelltext:
[code]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
function markDesc(){
var num = this.firstChild.data.replace(/ /,"");
if(document.getElementById("g"+num)){
document.getElementById("g"+num).style.color = "red";
}
}
function umarkDesc(){
var num = this.firstChild.data.replace(/ /,"");
if(document.getElementById("g"+num)){
document.getElementById("g"+num).style.color = "black";
}
}
function extendTDNode(){
var tr = document.getElementsByTagName('tr');
for(i = 0; i < tr.length;i++){
if(tr[i].getAttribute('class') == "spalte_xyz"){
var n = tr[i].firstChild;
while(n != null){
n.style.cursor = "pointer";
n.onmouseover = markDesc;
n.onmouseout = umarkDesc;
n = n.nextSibling
}
}
}
}
</script>
</head>
<body onload="extendTDNode()">
<span id="g1"> AA</span>
<span id="g2"> BB</span>
<span id="g3"> CC</span>
<table>
<tr class="spalte_xyz">
<td class="block_1" >1</td>
<td class="block_1" >2</td>
<td class="block_1" >3</td>
<td class="block_1" >1</td>
<td class="block_1" >2</td>
<td class="block_1" >3</td>
</tr>
</table>
</body>
</html>[/code]
Antwort 1 von katy
Hallo Dr.Ma-Busen,
ich hätte eine Idee:
Du versuchst mit var n=tr.firstChild auf das erste <td> zuzugreifen. In deinem Quelltext kommt zwischen <tr> und <td> aber noch ein Zeilenumbruch. Manche Browser interpretieren dann diesen Zeilenumbruch als firstChild.
ich könnte mir vorstellen,d ass es es klappt ohne den Zeilenumbruch im Quellcode.
Du könntest aber auch direkt auf das <td> zu greifen mit diesem Code:
Das müsste exakt das erste <td> innerhalb von tr geben.
Einen schönen Montag wünscht
katy
ich hätte eine Idee:
Du versuchst mit var n=tr.firstChild auf das erste <td> zuzugreifen. In deinem Quelltext kommt zwischen <tr> und <td> aber noch ein Zeilenumbruch. Manche Browser interpretieren dann diesen Zeilenumbruch als firstChild.
ich könnte mir vorstellen,d ass es es klappt ohne den Zeilenumbruch im Quellcode.
Du könntest aber auch direkt auf das <td> zu greifen mit diesem Code:
var n=tr.getElementsByTagName("td")[0]Das müsste exakt das erste <td> innerhalb von tr geben.
Einen schönen Montag wünscht
katy
Antwort 2 von katy
Hallo Dr.Ma-Busen,
was mir an deinem Code noch auffällt ist das Fehlen der eckigen Klammern hinter tr, es müsste eigentlich immer tr[index] innerhalb der Funktion heißen, da du die Elemente <tr> in einer Elementliste, also so wie ein Array, ansprichst.
Ist das jetzt ein Kopierfehler? Denn ohne die Klammern sollte das meinem Verständnis nach in gar keinem Browser funktionieren.
Und - ja ich weiß, ich neige zu Perfektionismus - statt
Grüße
katy
was mir an deinem Code noch auffällt ist das Fehlen der eckigen Klammern hinter tr, es müsste eigentlich immer tr[index] innerhalb der Funktion heißen, da du die Elemente <tr> in einer Elementliste, also so wie ein Array, ansprichst.
Ist das jetzt ein Kopierfehler? Denn ohne die Klammern sollte das meinem Verständnis nach in gar keinem Browser funktionieren.
Und - ja ich weiß, ich neige zu Perfektionismus - statt
getAttribute('class'classNameGrüße
katy
Antwort 3 von Dr.Ma-Busen
Ha, der Zeilenumbruch war es :)
Habe jetzt das script an entsprechender stelle erweiter mit:
if(n.nodeName == "TD"){...}
Die eckigen Klammern fehlen nur hier im SN. Ich habe die variable in den Klammer i genannt, aber eckige Klammern mit einen i drin interpretiert das SN als BCC-Code für Kursiven text.
MfG
Habe jetzt das script an entsprechender stelle erweiter mit:
if(n.nodeName == "TD"){...}
Die eckigen Klammern fehlen nur hier im SN. Ich habe die variable in den Klammer i genannt, aber eckige Klammern mit einen i drin interpretiert das SN als BCC-Code für Kursiven text.
MfG