问答详情
源自：9-22 编程练习

为什么用了.lastChild获取的才是table节点？

如题：

偌颜宁解释说：table的子元素是text空节点和tbody节点，而tr和td都在tbody节点中，所以需要获取table的最后一个子节点元素才行


问题一:意思是通过.lastChild获取的实际是tbody节点么？但事实上课程已给的代码中</tr>和</table>之间还有空格，也就是说我认为tbody节点后还有text空节点，怎么能确定通过.lastChild获取的不是text空节点呢？


问题二：table中如果用tbody的话，亦须先用thead和tfoot，即便thead中不同时含有tr、td（含的是th、td），tfoot中却同时含有tr和td，为什么偌颜宁解释table的子元素是text空节点和tbody节点，而不是text空节点、thead节点、tfoot节点和tbody节点以及tbody后可能的text空节点？


只是对偌颜宁的解答仍有些疑惑不理解，没别的意思。望热心的学友帮忙解答一下我的两个问题，谢谢

提问者：ShawpLee 2014-11-26 20:39

个回答

  • qq_程序付冬霞_03860998
    2016-11-08 15:30:04

    我也遇到了同样的问题，怎么也没想通

    0
  • 睡觉小能手
    2016-10-20 16:17:21

    <thead>和<tfoot>不会被默认生成;碰到有<tr>或<td>或<th>,就会有<tbody>.若一个都无,则不会有<tbody>;浏览器加载到<tr>,自动在外面套上父级<tbody>，那个空白标签其实是第一个<tr>前面的，<tbody>添加的时候并有没有把这个空白标签包括进去，这是我的理解，看下这段代码就没有空白字符了。

    <!DOCTYPE html>

    <html>

    <head>

        <meta charset=UTF-8>

        <title>Document</title>

    </head>

    <body>

        <table border="1" width="50%" id="table"><tr>

                <td>学号</td>

                <td>姓名</td>

                <td>操作</td>

            </tr>

            <tr>

                <td>xh001</td>

                <td>王小明</td>

                <td><a href="javascript:;">删除</a></td>

                <!--在删除按钮上添加点击事件  -->

            </tr>

            <tr>

                <td>xh002</td>

                <td>刘小芳</td>

                <td><a href="javascript:;">删除</a></td>

                <!--在删除按钮上添加点击事件  -->

            </tr></table>

        <script type="text/javascript">

        var a = document.getElementById('table');

        var b = a.childNodes;

        console.log(b.length);

        for (var i = 0; i < b.length; i++) {

            document.write("<br/>" + b[i].nodeName);

        }

        </script>

    </body>

    </html>


    1
  • wboyhhhh
    2016-04-10 17:37:47

    把table的所有子节点获取，然后输出就可以知道结果了。

    570a1ed80001d71605000165.jpg

    570a1ed80001ef7b05000379.jpg


    1
  • 夜山狼
    2016-03-11 10:28:07

    14年的问题了。我16年还是很想知道

    1
  • 佐刈
    2015-05-25 12:14:57

    table习惯上,我们常常把标签<tbody></tbody> 省略,但是在dom中他默认有tbody这一层，所以获取的是<tbody></tbody>里面内容

    5
  • ShawpLee
    2014-11-29 20:12:52

    有会的可以帮忙回答一下这个问题么，谢谢

    0
  • ShawpLee
    2014-11-26 20:45:13

    虽然用

    function mydel(obj){

           var tr=obj.parentNode.parentNode;

          tr.parentNode.removeChild(tr);

        }  

    同样能够解决问题，但我还是希望能把这里的.lastChild问题给搞懂，望指教

    0