为了账号安全,请及时绑定邮箱和手机立即绑定

删除函数怎么理解

function del(obj)     {         var tr=obj.parentNode.parentNode;         tr.parentNode.removeChild(tr);     } 这段代码中为什么有3个parentNode,不应该是一个就转到td了吗

正在回答

5 回答

其他回答都说的挺好的了  我就简单发表一下我的看法

1、首先看看删除子集的表达式和用法:father.removeChild(child)

2、要实现本节内容要求的行删除,实则为删除一个<tr>,需要以<table>为father,<tr>为child来执行删除子集

3、obj显然只能是包含“删除”二字的<a>标签,显然<table>是<a>的三级父标签,<tr>是<a>的二级父标签,因此,你提问里的tr=obj.parentNode.parentNode;  

table=tr.parentNode=obj.parentNode.parentNode.parentNode;

(斜体字为你所问的3个parentNode来源)

0 回复 有任何疑惑可以回复我~

参考答案是漏了很多的,可以说,正确的写法是:

<table>

    空白文本节点

    <tbody>

        <tr>

            <td></td>

        </tr>

    </tbody>

</table>

0 回复 有任何疑惑可以回复我~
#1

走馬勿观花

DOM中如上面所示,所以虽然html不写,但是DOM中确实存在
2020-03-25 回复 有任何疑惑可以回复我~

html里,<table>下面就是<tr>

但是,在DOM中,默认还是<table><tbody><tr>。也就是,tr的父级是tbody,这是默认了的。

而至于,此例子中,table下面则有两个看不见的子节点,第一个是文本节点,第二个才是tbody。所以,获取tbody则用  .lastChild   或者  childNodes[1]

0 回复 有任何疑惑可以回复我~

    del();

     function del(){

            var getA = document.getElementsByTagName("a");                      

            for(var i=getA.length-1;i>=0;i--){

            var te=getA[i].parentNode.parentNode.parentNode;

                getA[i].onclick = function(){

                    te.removeChild(this.parentNode.parentNode);

// this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);

                }

            }

        }


0 回复 有任何疑惑可以回复我~

是的,但是这段代码的意思是获取tr的父节点table,再删除tr.

obj 代表的 a标签,那么obj.parentNode是a外面的那个td标签,

obj.parentNode.parentNode是td外面的tr标签。

tr.parentNode获取到的是tr外面的table标签,通过table标签的removeChild方法去删除需要删除那个tr标签。

我是这么理解的,供你参考。

0 回复 有任何疑惑可以回复我~
#1

走馬勿观花

tr的父节点,DOM中始终默认是tbody
2020-03-25 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JavaScript进阶篇
  • 参与学习       468044    人
  • 解答问题       21891    个

本课程从如何插入JS代码开始,带您进入网页动态交互世界

进入课程

删除函数怎么理解

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信