爲什麼firefox無法獲取元素節點以及IE？

這是一個選擇工資方法的腳本。它工作在IE瀏覽器，但是當我在FF運行它，它與此錯誤停止： Error: document.getElementById("tdeposit").childNodes[0].childNodes[0] is undefined.爲什麼firefox無法獲取元素節點以及IE？

您可以將此代碼粘貼到一個HTML文件，看到了問題：

我已刪除的，因爲隱私的網站地址問題，圖像鏈接改變

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Test</title> 
<style> 
#tdeposit { 
width:550px; 
margin:10px auto; 
font-family:Arial; 
font-size:13px; 
font-weight:bold; 
letter-spacing:1px; 
color:#444; 
text-align:center; 
} 
</style> 
</head> 

<body> 
<script> 
function methodis(method){ 
if(method=='wm'){ 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[1].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[2].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[3].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[4].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[1].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[2].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[3].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[4].style.visibility='hidden'; 
document.deposit.method[0].checked=true; 
} 
if(method=='lr'){ 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[1].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[2].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[3].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[0].childNodes[4].style.visibility='hidden'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[1].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[2].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[3].style.visibility='visible'; 
document.getElementById('tdeposit').childNodes[0].childNodes[1].childNodes[4].style.visibility='visible'; 
document.deposit.method[1].checked=true; 
} 
return 0; 
} 

function calculate(ob,per){ 
    if(ob.value.length<8){ 
document.getElementById(ob.name).innerHTML = '$ '+(per*ob.value).toFixed(2); 
    }else{ 
document.getElementById(ob.name).innerHTML = '$ 0'; 
    } 
} 
</script> 
<form name='deposit' action='deposit.php'> 
    <table id='tdeposit' > 
    <tbody> 
     <tr> 
     <td><input type='radio' name='method' value='wm' style='width:20px; height:50px' /> 
      <img src='http://www.xxxxxxxxx.com/images/webmoney.png' onclick='methodis("wm");' /></td> 
     <td style='width:110px; visibility: hidden;'> $ 
      <input style='margin:5px; height:20px; width:50px; text-align:center' type='text' name='wmht' onkeyup='calculate(this,0.98);' /> 
      WM</td> 
     <td style='width:25px; visibility: hidden;'><img src='http://www.xxxxxxxxx.com/images/convert.gif' /></td> 
     <td style='width:100px; visibility: hidden;' ><span id='wmht' style='color:#060'>$ 0.0</span> HT</td> 
     <td style='width:100px; visibility: hidden;'><input type='submit' value=' Deposit ' /> 
     </tr> 
     <tr style='border-top:solid 1px #999'> 
     <td><input type='radio' name='method' value='lr' style='width:20px; height:50px' /> 
      <img src='http://www.xxxxxxxxx.com/images/libertyreserve.png' onclick='methodis("lr");'/></td> 
     <td style='visibility: hidden;'> $ 
      <input style='margin:5px; height:20px; width:50px; text-align:center' type='text' name='lrht' onkeyup='calculate(this,0.95);' /> 
      LR</td> 
     <td style='visibility: hidden;'><img src='http://www.xxxxxxxxx.com/images/convert.gif' /></td> 
     <td style='visibility: hidden;'><span id='lrht' style='color:#060'>$ 0.0 </span> HT</td> 
     <td style='visibility: hidden;'><input type='submit' value=' Deposit ' /> 
     </tr> 
    </tbody> 
    </table> 
</form> 
</body> 
</html>

來源

2012-02-22 AMIN Gholibeigian

什麼在地球上...... – 2012-02-22 12:21:02

這段代碼讓我想拍攝某人。 – ThiefMaster 2012-02-22 12:23:35

如果你看到一行一行地重複的代碼[又名'document.getElementById（'tdeposit'）。childNodes [0] .childNodes [0]']，你應該試着找出如何刪除它。一遍又一遍的相同代碼效率低下，因爲瀏覽器必須一次又一次地查找該節點。 – epascarello 2012-02-22 12:52:51

document.getElementById('tdeposit').childNodes[0]引用<table>標籤下面的空格中TextNode。也許IE不理會它，但不是其他瀏覽器。使用children獲得者而不是childNodes。

來源

2012-02-22 12:26:31

...但嚴重的是，你應該重新考慮你的代碼。 – 2012-02-22 12:27:39

謝謝你，夥計，這是偉大的 – 2012-02-22 12:51:45

亞歷克斯，我正在重新考慮。在這部分代碼中，我應該做出改變嗎？ – 2012-02-22 12:58:15

爲什麼firefox無法獲取元素節點以及IE？

回答

相關問題