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

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

本帖最后由 秦兰之 于 2013-6-21 04:34 编辑

完全按照毕老师的视频做出来的,不同的只是他用DW3,我用DW4。
好不容易浏览器可以测试了,测试多个html页面总是报一样的错,大同小异。
报错:69 行无法获取属性“0”的值: 对象为 null 或未定义?
还有为什么没有样式?
排序功能也没有。

<!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:#09F 1px solid;
        border-collapse:collapse;
        width:600px;
        }
table td,table th{
        border:#09F 1px solid;
        padding:10px;
        }
#age link,age visited{
        color:#000;        
        }

</style>

<script type="text/javascript">

var b;
var arr=[];//定义临时容器,用于存储参与排序的行对象。
function sortTable()
{
        /*
        需求:对表格中的行按照年龄从小到到大进行排序。
        
        思路:
        1.参与排序的行对象很多,需要临时存储,定义一个容器。
        2.对临时数组进行指定数据的排序。
        3.将排序后的数组中的行对象,重新添加回表格中。
        
        */        
        var tabNode=document.getElementsByTagName("table")[0];
        
        //arr
        
        var trs=tabNode.rows;
        
        for(var x=0; x<trs.length; x++)
        {
                arr[x-1]=trs[x];                                                                                                //遍历行对象的数组,再将数组中的元素重新存入一个新数组当中。                        
        }
        
        //alert(arr.length);
        
        mysort(arr);
        
        //使用布尔值操作,判断事件是用升序还是降序。        
        if(b)
        {
                for(var x=0; x<arr.length; x++)                                                                                //打印列数组中角标为1的列集合中的文本内容。
                {
                        //alert(arr[x].cells[1].innerHTML);        
                        //arr[x].parantNode.appendChild(arr[x]);               
                        
                        tabNode.ChildNode[0].appendChild(arr[x]);                                                //将表格的子节点对象添加到数组的子节点中。
                        b=false;                                                                                                                //将b的值设为false。
                        
                }
        }
        else
        {
                for(var x=0; x<arr.length; x++)                                                                                //打印列数组中角标为1的列集合中的文本内容。
                {        
                        //69 行无法获取属性“0”的值: 对象为 null 或未定义?
                        tabNode.ChildNode[0].appendChild(arr[x]);                                                //将表格的子节点对象添加到数组的子节点中。
                        b=true;
                        
                }        
        }
        
}

//给数组排序。
function mysort()
{
        for(var x=0; x<arr.length-1; x++)
        {
                for(var y=x+1; y<arr.length; y++)                                                                //y+1:获取的是行对象中角标为一的单元格对象。
                {
                        
                        //arr[x].cells[1].innerHTML : 列数组中角标为1的列集合中的文本内容。
                        //文本内容默认情况下是用字符串进行排序的。
                        if(parseInt(arr[x].cells[1].innerHTML) > parseInt(arr[y].cells[1].innerHTML))                 
                        {
                                var temp=arr[x];
                                arr[x]=arr[y];
                                arr[y]=arr[x];
                        }
                }        
        }        
        
}

</script>

</head>

<body>
<!--
对表格中的指定数据进行排序。

-->

<table>
    <tr>
        <th>姓名</th>
        <th><a id="age" href="javascript void(0)"/>年龄</th>
        <th>地址</th>
    </tr>
   
    <tr><td>张三</td>
            <td>23</td>
        <td>北京</td>   
    </tr>
     <tr><td>李四</td>
            <td>25</td>
        <td>天津</td>   
    </tr>
     <tr><td>王五</td>
            <td>29</td>
        <td>上海</td>   
    </tr>
     <tr><td>赵六</td>
            <td>25</td>
        <td>南京</td>   
    </tr>
     <tr><td>周期</td>
            <td>26</td>
        <td>广州</td>   
    </tr>
     <tr><td>孙八</td>
            <td>23</td>
        <td>重庆</td>   
    </tr>
     <tr><td>李九</td>
            <td>30</td>
        <td>北京</td>   
    </tr>
     <tr><td>冯十</td>
            <td>23</td>
        <td>大连</td>   
    </tr>
</table>

</body>
</html>

评分

参与人数 1技术分 +1 收起 理由
曹睿翔 + 1 神马都是浮云

查看全部评分

6 个回复

倒序浏览
错误一:
href="javascript:void(0)"
错误而:没有添加事件
a 的属性中添加onclick="sortTable()"

错误三:
mysort(arr);你定义这个函数的时候是没有参数的

function mysort(arr)



如果还是不懂。你可以看看这个
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>无标题文档</title>

  6. <script type="text/javascript">
  7. var b = true;
  8. function sorttab()

  9. {
  10.         var tabNode = document.getElementsByTagName("table")[0];
  11.         var trs = tabNode.rows; //获取行元素
  12.        
  13.         //alert(trs.length);
  14.         var arr = new Array();  //定义一个临时容器。
  15.         for(var i=1;i<trs.length;i++)
  16.         {
  17.                 //alert(trs[i].cells[1].innerText);
  18.                 arr[i-1] = trs[i]; //将行都添加到临时容器中
  19.         }
  20.         //alert(arr.length);
  21.         //sortt(arr);
  22.         arr.sortt();
  23.         var tbdNode = document.getElementsByTagName("tbody")[0];
  24.         //alert(tbdNode.nodeName);
  25.         if(b)
  26.         {
  27.                 for(var i=0;i<arr.length;i++)
  28.                 {
  29.                         //alert(arr[i].cells[1].innerText);
  30.                         //alert(arr[i].cells[0].innerText+"...."+arr[i].cells[1].innerText);
  31.                         tbdNode.appendChild(arr[i]);
  32.                 }
  33.                 b = false;
  34.         }
  35.         else
  36.         {
  37.                 for(var i=arr.length-1;i>=0;i--)
  38.                 {
  39.                         //alert(arr[i].cells[1].innerText);
  40.                         //alert(arr[i].cells[0].innerText+"...."+arr[i].cells[1].innerText);
  41.                         tbdNode.appendChild(arr[i]);
  42.                         b = true;
  43.                 }
  44.         }
  45.        
  46. }
  47. function sortt()
  48. {
  49.         for(var x=0;x<this.length;x++)
  50.         {
  51.                 for(var y=x+1;y<this.length;y++)
  52.                 {
  53.                         if(parseInt(this[x].cells[1].innerText)>parseInt(this[y].cells[1].innerText))
  54.                         {
  55.                                 var tmp = this[x];
  56.                                 this[x] = this[y];
  57.                                 this[y] = tmp;
  58.                         }
  59.                 }
  60.         }
  61. }
  62. Array.prototype.sortt = sortt;

  63. /*window.onload = function()
  64. {
  65.         var tabNode = document.getElementsByTagName("table")[0];
  66.         var nodes = tabNode.childNodes[1];
  67.         for(var x=0;x<nodes.length;x++)
  68.         {
  69.                 alert(nodes[x].nodeName);
  70.         }
  71.         var trNode= document.getElementsByTagName("tr")[0];
  72.         //alert(trNode.parentNode.parentNode.nodeName);
  73.         alert(nodes.nodeName);
  74. }*/
  75. </script>


  76. </head>

  77. <body>

  78. <table border="1" cellpadding="4" cellspacing="1" width="70%" bordercolor="#00FFCC">
  79.         <tr bgcolor="#0099CC">
  80.             <th>姓名</th>
  81.         <th><a href="javascript:void(0)" onclick="sorttab()">年龄</a></th>
  82.         <th>地址</th>
  83.     </tr>
  84.    
  85.     <tr>
  86.             <td>张三</td>
  87.         <td>30</td>
  88.         <td>北京</td>
  89.     </tr>
  90.    
  91.     <tr>
  92.             <td>李四</td>
  93.         <td>4</td>
  94.         <td>上海</td>
  95.     </tr>
  96.     <tr>
  97.             <td>王武</td>
  98.         <td>23</td>
  99.         <td>广州</td>
  100.     </tr>
  101.     <tr>
  102.             <td>赵六</td>
  103.         <td>27</td>
  104.         <td>南京</td>
  105.     </tr>
  106.     <tr>
  107.             <td>周七</td>
  108.         <td>25</td>
  109.         <td>大连</td>
  110.     </tr>
  111.     <tr>
  112.             <td>孙八</td>
  113.         <td>29</td>
  114.         <td>铁岭</td>
  115.     </tr>
  116. </table>
  117. </body>
  118. </html>
复制代码

评分

参与人数 1技术分 +1 收起 理由
曹睿翔 + 1 很给力!

查看全部评分

回复 使用道具 举报
Super_Class 发表于 2013-6-8 07:40
错误一:
href="javascript:void(0)"
错误而:没有添加事件

Array.prototype.sortt = sortt;
注释一下这句代码行不?不懂。
回复 使用道具 举报
秦兰之 发表于 2013-6-8 07:59
Array.prototype.sortt = sortt;
注释一下这句代码行不?不懂。

给一个已有的类型添加一个方法
回复 使用道具 举报
楼主你好  如果帖子的问题已经解决,请把帖子的类型改为“已解决”。{:soso_e102:}
回复 使用道具 举报
虽然还是看不懂,不过服了。
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马