热门关键字:
jquery > jquery教程 > jquery教程 > jQuery DOM操作empty与remove的区别

jQuery DOM操作empty与remove的区别

275
作者:管理员
发布时间:2021/1/22 18:46:27
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=3410
empty方法


    严格地讲,empty()方法并不是删除节点,而是清空节点,它能清空元素中的所有后代节点


    empty不能删除自己本身这个节点


remove方法


    该节点与该节点所包含的所有后代节点将同时被删除


    提供传递一个筛选的表达式,删除指定合集中的元素


下面我们将用代码来详细剖析


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>remove()与empty()的区别</title>
    <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
    <style type="text/css">
        #dv1{
            width:250px;
            height:250px;
            background:red;
            float:left;
        }


        #dv2{
            width:250px;
            height:250px;
            background:green;
            float: left;
            margin-left:5px;
            margin-right:5px;
        }
    </style>
</head>
<body>
    <div id="dv1">
        <p>元素1</p>
        <p>元素2</p>
    </div>


    <div id="dv2">
        <p>元素3</p>
        <p>元素4</p>
    </div>
    <input type="button" value="empty" id="but1">
    <input type="button" value="remove" id="but2">


    <script>
        $("#but1").click(function(){
            $("#dv1").empty();
        })


        $("#but2").click(function(){
            $("#dv2").remove();
        })
    </script>
</body>
</html>




如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:jQuery
友荐云推荐