为什么remove和detach事件一样,谁能解释一下

来源:4-5 DOM节点删除之detach()和remove()区别

梦幻弥漫

2016-04-28 21:16

<html>

<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <style type="text/css">
    p{
        border: 1px solid red;
    }
    </style>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>

<body>
    <h3>给页面2个p元素节点绑定点击事件,点击后弹出自己本身的节点内容</h3>
    <p>元素p1,同时绑定点击事件</p>
    <p><span>666</span>元素p2,同时绑定点击事件</p>
    <h3>通过点击2个按钮后观察方法处理的区别</h3>
    <button>点击通过remove处理元素p1</button>
    <button id="btn">复制</button>
    <button>点击通过detach处理元素p2</button>
</body>
<script type="text/javascript">
    var p;
    //给页面上2个p元素都绑定时间
    $('p').click(function(e) {
        alert(e.target.innerHTML)
    })
    
    $("button:first").click(function() {
         p = $("p:first").remove();
    });

    $("button:last").click(function() {
          p = $("p:first").detach();
    });
    $("#btn").click(function(){     
        alert(p);
        $("body").append(p);
    })
    
</script>
</script>

</html>

写回答 关注

3回答

  • 疾风常伴
    2016-04-28 22:20:13
    已采纳

    你的测试有问题,remove()删除元素之后文本内容会被保存,只是jQuery绑定的事件和数据会被销毁,而decath()会保存jQuery绑定的事件和数据

    梦幻弥漫

    不是很懂 但是谢谢你的解答

    2016-04-29 19:33:53

    共 1 条回复 >

  • chencw111
    2016-07-07 19:29:11

    课件讲的有错误,remove()不会把匹配的元素从 jQuery 对象中删除,因而可以在将来再使用这些匹配的元素,其他的比如绑定的事件、附加的数据等都会被移除。所以你用remove()删除后,依然能使用append()再把它找回,但先前绑定在p1上的点击事件已经没有了,而使用detach()就不会让绑定在上面的事件消失

    qq_逐梦之... 回复慕粉1906...

    点击事件啊,就是click

    2018-10-28 22:32:14

    共 2 条回复 >

  • 疾风常伴
    2016-04-28 21:35:30

    detach会保留jQuery的事件和数据啊

jQuery基础(二)—DOM篇

jQuery第二阶段开启DOM修炼,了解创建、插入、删除与替换

114014 学习 · 590 问题

查看课程

相似问题