jQuery文档操作--empty()和remove()

empty()

概述

删除匹配的元素集合中所有的子节点

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
        <script>
            $(document).ready(function() {
                //empty()删除匹配的元素集合中所有的子节点
                $("button").click(function() {
                    $("div").empty();
                });
            });
        </script>
    </head>

    <body>
        <div style="background-color: #FF0000; 130px;height: 50px;">
            <ol>
                <li>第一段话</li>
                <li>第二段话</li>
            </ol>
        </div>
        <button>点击</button>
    </body>

</html>

**remove([expr])**

概述

从DOM中删除所有匹配的元素。

这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外，其他的比如绑定的事件，附加的数据等都会被移除

参数

expr 用于筛选元素的jQuery表达式

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
        <script>
            $(document).ready(function() {
                //remove()从DOM中删除所有匹配的元素
                $("button").click(function() {
                    $("div").remove();
                });
            });
        </script>
    </head>

    <body>
        <div style="background-color: #FF0000; 130px;height: 50px;">
            <ol>
                <li>第一段话</li>
                <li>第二段话</li>
            </ol>
        </div>
        <button>点击</button>
    </body>

</html>