A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

<!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>无标题文档</title>
<style type="text/css">
table{
border:#0066FF 1px solid;
width:600px;
border-collapse:collapse;}
table th,table td{
border:#0066FF 1px solid;
padding:10px;}
table th{
background-color:#00FF66;}
table td{
background-color:#CCFFCC;}
#repswspan{
margin-left:125px;}
.errorinfo{
color:#FF0000;
display:none;}
.focus{
border:#00FFFF 2px solid;}
.norm{
border:#999999 1px solid;}
.error{
border:#FF0000 2px solid;}
</style>
<script type="text/javascript">
window.onload = function()
{
  var tabNode = document.getElementsByTagName('table')[0];
  var tbNode = tabNode.childNodes[0];//获取table的子节点tbody
  alert(tbNode.nodeName);
}
</script>
</head>
<body>
<form>
<table>
     <tr>
         <th>注册表单</th>
        </tr>
        <tr>
         <td>
             <div>用户名</div>
                <div><input type="text" name="user" /></div>
                <div>用户名错误</div>
                <div>用户名必须是4-6位,由字母(a-z),数字(0-9),下划线(_)组成</div>
            </td>
        </tr>
        <tr>
         <td>
             <div><span>密码</span> <span>确认密码</span></div>
                <div>
                 <input type="password" name="psw" />
                    <input type="password" name="repsw" />
                </div>
                <div>密码错误</div>
                <div>两次密码输入不一致</div>
                <div>密码必须是4-6位,由字母(a-z),数字(0-9)组成</div>
            </td>
        </tr>
        <tr>
         <td>
             <div>邮箱</div>
                <div><input type="text" name="mail" /></div>
                <div>邮箱地址错误</div>
            </td>
        </tr>
        <tr>
         <th>
             <input type="submit" />
            </th>
        </tr>
    </table>
</form>
</body>
</html>
我按毕向东老师的视频自己写了一段表单验证的HTML代码,
用var tabNode = document.getElementsByTagName('table')[0];
  var tbNode = tabNode.childNodes[0];//获取table的子节点tbody
  alert(tbNode.nodeName);
毕向东老师打印出来的结果是tbody,我用搜狗浏览器和IE8打印出来的也是tbody
但是用火狐和ie9打印出来的结果却是#text。有人知道为什么吗?是浏览器问题,还是老师讲错了?
ie8的打印结果:
搜狗浏览器:
火狐浏览器:

2 个回复

倒序浏览
浏览器内部的实现有区别
firefox和ie9使用节点的childNodes属性时,获取的不准确,
推荐使用的getElementsByTagName()获取子节点的集合
回复 使用道具 举报
王志明 发表于 2012-7-26 10:08
浏览器内部的实现有区别
firefox和ie9使用节点的childNodes属性时,获取的不准确,
推荐使用的getElementsB ...

:L我经过测试,IE8和搜狗、E影浏览器显示效果和IE6显示效果一样,都是tbody。而IE9和火狐的显示效果却是#text。
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马