childNodes collection
Jeg har forsøgt at finde hoved og hale i childNodes collection. Scriptet, nedenunder, finder billedet der er placeret i den højre celle <td>, ved en mouseover på <tr> elementet.Men der er et par ting jeg gerne vil spørge om.
1.: FF childNodes collection er 5 item's, IE's er 3. Jeg har fundet frem til at det er 3 ekstra text nodes. I microsoft's dokumentation står at IE sorterer disse text nodes fra collectionen men hvor er de rent faktisk placeret og kan jeg forhindre at FF 'finder' dem ?
2.: Nedenstående script finder billedet ved at bruge det sidste item() der har tagName="TD", men hvis jeg nu sætter en ekstra celle på rækken i tabellen, så finder mit script ikke billedet. Er der en nemmerer/bedre/mere korrekt måde at finde childNodes 'stien' til billedet ?
Mvh. Johan
Koden :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<title>Test.</title>
<style type="text/css">
table { border: 1px solid black; }
tr { cursor: pointer; }
td { border: 1px solid red; }
</style>
<script type="text/javascript">
function oFunc(oTR, act)
{
for(i=0; i<oTR.childNodes.length; i++) {
if(oTR.childNodes.item(i).tagName=="TD") {
oImg = new Object(oTR.childNodes.item(i).firstChild); } }
act=="in"? oImg.src="pic.jpg":oImg.src="pic1.jpg";
return true;
}
</script>
</head>
<body>
<table style="width: 400px; margin: 0 auto;">
<tr onmouseover="oFunc(this, 'in')" onmouseout="oFunc(this, 'out')">
<td>Noget tekst !</td>
<td><img src="pic1.jpg" alt="oPic"></td>
</tr>
</table>
</body>
</html>
