Jquery学习笔记:删除节点的操作

假设如下的html代码

<div id="mydiv" style="width:100px;height:100px;border:1px solid red">
        xxx
        <div>s1</div>
        <div>s2</div>
</div>

有下面的方法可以进行删除节点操作:

$("#mydiv").remove();   //remove方法删除mydiv节点本身,以及其下的所有内容,以及子节点

$("#mydiv").empty();    //empty不删除mydiv节点本身,只清空节点下的内容(包括子节点)

$("#mydiv").children().remove();  //删除mydiv下的所有子节点。主要其下的文本不会被删除,如上面的xxx信息不会被删除

$("#mydiv div").remove();  //效果同$("#mydiv").children().remove(); 

总结下,在大部分场景下,要删除所有子节点,就用empty方法;要删除自身及子节点,就用remove方法。

你可能感兴趣的:(Jquery学习笔记:删除节点的操作)