黑马程序员技术交流社区

标题: 毕老师视频 ——DOM表格排序 [打印本页]

作者: 邝雄伟    时间: 2013-1-19 14:09
标题: 毕老师视频 ——DOM表格排序
按照视频写的,找了半天不知道错在哪里。求大神指点,十分感谢

  <tr>
            <td>
                周期
        </td>
        <td>
                25
        </td>
        <td>
                光京
        </td>
    </tr>


网页错误详细信息

用户代理: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727)
时间戳: Sat, 19 Jan 2013 06:09:46 UTC


消息: 缺少对象
行: 65
字符: 1
代码: 0
URI: file:///K:/java%20study/day28/sortTable.html


作者: 邝雄伟    时间: 2013-1-19 14:10
<!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:#03C 1px solid;
        width:600px;
        border-collapse:collapse;
    }
table td{
        border:#363 1px solid;
        padding:10px;
        }
#age:link,#age:visited{
        color:#00C;       
}       
</style>

<script type="application/x-javascript">
function sortTable()
{
        var tabNader= document.getElementsByTagName("table")[0];
        var arr=[];
        var trs = tabNade.rows;
        for(var x=0; x<trs.length; x++)
        {
                arr[x-1] = trs[x];       
        }
        mysort(arr);
        for(var x = 0 ;x<arr.length; x++)
        {
                alert(arr[x].cells[1].innerHTML);
                //tabNade.chileNodes.appendChild(arr[x]);
        }
       
}
function mysort(arr)
{
        for(var x=0; x<arr.length-1; x++)
        {
                for(var y=x+1; y<arr.length; y++)
                {
                        if(parseInt(arr[x].cells[1].innerHTML) > parseInt(arr[y].cells[1].innerHTML))
                        {
                                var temp = arr[x];
                                arr[x] = arr[y];
                                arr[y] = temp;
                        }
                }
        }
}
</script>

</head>

<body>

<table>
        <tr>
            <th>
                姓名
        </th>
        <th><a  id="age" href="javascript:void(0)" onclick="sortTable()">年龄</a>
               
        </th>
        <th>
                城市
        </th>
    </tr>
    <tr>
            <td>
                战三
        </td>
        <td>
                21
        </td>
        <td>
                北京
        </td>
    </tr>
    <tr>
            <td>
                李四
        </td>
        <td>
                16
        </td>
        <td>
                上海
        </td>
    </tr>
    <tr>
            <td>
                王五
        </td>
        <td>
                11
        </td>
        <td>
                广州
        </td>
    </tr>
    <tr>
            <td>
                赵六
        </td>
        <td>
                13
        </td>
        <td>
                深圳
        </td>
    </tr>
    <tr>
            <td>
                周期
        </td>
        <td>
                25
        </td>
        <td>
                光京
        </td>
    </tr>
      <tr>
            <td>
                酸吧
        </td>
        <td>
                4
        </td>
        <td>
                大连
        </td>
    </tr>
</table>
</body>
</html>

程序代码是这个




欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2