Question

这是一个选择付费方式的脚本。它在IE中工作，但是当我在FF中运行时，它会因此错误而停止： Error: document.getElementById("tdeposit").childNodes[0].childNodes[0] is undefined.

您可以将此代码粘贴到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>

Answer 1

document.getElementById('tdeposit').childNodes[0]引用<table>标记后面的空格的TextNode。也许IE无视它，但不是其他浏览器。使用children getter代替childNodes。

为什么firefox无法获取元素节点以及IE？

1 个答案: