- remove() - 删除被选元素(及其子元素)
- empty() - 从被选元素中删除子元素
一、remove()方法
<script>
$(document).ready(function(){
$("button").click(function(){
//根据id选择器,获取对应容器。将容器本身以及内部元素全部删除
$("#div1").remove();
//根据元素选择器,获取对应的元素。将所有满足.italic的class选择器的元素删除,这里的选择器也可以是别的,比如id选择器
$("p").remove(".italic")
});
});
</script>
...
<div id="div1">
这是 div 中的一些文本。
<p>这是在 div 中的一个段落。</p>
<p>这是在 div 中的另外一个段落。</p>
</div>
<p>这是一个段落。</p>
<p class="italic"><i>这是另外一个段落。</i></p>
<p class="italic"><i>这是另外一个段落。</i></p>
<button>移除所有 class="italic" 的 p 元素。</button>
二、empty()方法
<script>
$(document).ready(function(){
$("button").click(function(){
//只删除容器中的子元素,元素本身不删除
$("#div1").empty();
});
});
</script>
...
<div id="div1">
这是 div 中的一些文本。
<p>这是在 div 中的一个段落。</p>
<p>这是在 div 中的另外一个段落。</p>
</div>
<br>
<button>清空div元素</button>