.empty()
返回: jQuery
.empty()
描述:从DOM上删除匹配的元素集合的所有的子元素节点。
加入于: 1.0
.empty()该方法不接受任何参数
该方法不仅删除子元素(以及别的后代元素),而且还会把匹配的元素集合中的任何文本删除。这是因为,根据DOM规范文档,任何在元素内部的文本字符串都会被视为该元素的一个子节点。设想以下HTML:
<div class="container"> <div class="hello">Hello</div> <div class="goodbye">Goodbye</div> </div>
我们可以瞄准任何要删除的元素:
$( ".hello" ).empty();
这将导致一个带有Hello文本的DOM结构被删除。
<div class="container"> <div class="hello"></div> <div class="goodbye">Goodbye</div> </div>
如果<div class="hello">中有任何数量的嵌套元素,它们也将被删除。
为了避免内存泄漏,jQuery在删除元素本身之前,先删除了子元素上的别的构造,比如说data和事件处理函数。
如果你只想删除事件,而不破坏它们的数据或者事件处理函数(从而它们可以在后在再次加回去),请使用.detach()方法代替它。
示例
从所有的段落文本中删除所有的子节点(包括文本节点):
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>empty demo</title>
<style>
p {
background: yellow;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>
Hello, <span>Person</span> <em>and person</em>.
</p>
<button>Call empty() on above paragraph</button>
<script>
$( "button" ).click(function() {
$( "p" ).empty();
});
</script>
</body>
</html>
演示结果