Jquery中emptyremovedetach用法
Posted IT技术分享社区
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Jquery中emptyremovedetach用法相关的知识，希望对你有一定的参考价值。
1jquery中empty()
1、只移除了 指定元素中的所有子节点，被选元素自己是不会被删除的。
2、例如
<p>dsfsd</p>
$("p").empty()
结果
<p></p>
2jquery中remove()
1、删除被选元素的所有文本和子元素，当然包括被选元素自己。
2、除了节点本身以外，节点绑定的事件和该节点相关的JQuery数据，也会被同时清除。
3、当需要清除节点本身，但是不需要清除绑定的事件和数据的时候，可以使用detach方法。
4、例如
<p>Hello</p>World<p>welcome</p>
$("p").remove()
结果
World
3jquery中detach()
1、detach方法和remove方法很相似，但是它会保留所有JQuery相关的数据和绑定的事件。
2、这个方法会保留 jQuery 对象中的匹配的元素，因而可以在将来再使用这些匹配的元素。
3、例如
(1)、删除并恢复一个元素
<html>
<head>
<script type="text/javascript" >
</script>
<script type="text/javascript">
...$(document).ready(function()... {
var x;
$("#btn1").click(function()... {
x = $("p").detach();
});
$("#btn2").click(function()... {
$("body").prepend(x);
});
});
</script>
</head>
<body>
<p>
这是一个段落。
</p>
<button id="btn1">
删除 p 元素
</button>
<button id="btn2">
恢复 p 元素
</button>
</body>
</html>
(2)、移动元素并保留其 click 事件
<html>
<head>
<script type="text/javascript" >
</script>
<script type="text/javascript">
...$(document).ready(function()... {
$("button").click(function()... {
$("body").append($("p").detach());
});
$("p").click(function()... {
$(this).animate(... {
fontSize: "+=1px"
})
});
});
</script>
</head>
<body>
<p>
在本段落移动之后，试着点击该段落，请注意它保留了 click 事件。
</p>
<button>
移动 p 元素
</button>
</body>
</html>
以上是关于Jquery中emptyremovedetach用法的主要内容，如果未能解决你的问题，请参考以下文章
nodejs中怎么用jquery的load()加载其他的页面
JQuery - 我可以用 jquery 移动数组元素吗？并将它们存储在另一个数组中？