您的位置：首页 > Web前端 > JQuery

jquery detach()和remove()的区别

2017-07-03 13:38 218 查看

remove：移除节点

- 无参数，移除自身整个节点以及该节点的内部的所有节点，包括节点上事件与数据

- 有参数，移除筛选出的节点以及该节点的内部的所有节点，包括节点上事件与数据

detach：移除节点

- 移除的处理与remove一致

- 与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来

<script type="text/javascript" src="js/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(e) {

//给p元素绑定事件
$('p').click(function (e) {
alert($(this).html());
})

//单击按钮1
$("#b1").click(function () {
var p = $("p:first").remove();
p.css('color', 'red').html('p1通过remove处理后,点击该元素,事件丢失')
$("body").append(p);
});
//单击按钮2
$("#b2").click(function () {
var p = $("p:last").detach();
p.css('color', 'blue').text('p2通过detach处理后,点击该元素事件存在')
$("body").append(p);
});

});
</script>

<body>

<p>p1，同时绑定点击事件</p>

<p>p2，同时绑定点击事件</p>

<h2>remove与detache区别</h2>
<input type="button" id="b1" value="remove处理p1">
<input type="button" id="b2" value="detach处理p2">
</body>

效果图：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航