欢迎您来到,码代码-李雷博客        登录  |  注册

jquery怎么删除元素本身

更新:2022-04-28 11:33:01
人气:64
来源:本站整理
A+

jquery删除元素本身可分成两种情况:

删除元素本身及其里面的内容(文本和子节点)

只删除元素本身,保留子节点

情况1、使用 remove( ) 方法

使用 remove( ) 方法来将某个元素及其内部的所有内容删除。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="js/jquery-1.10.2.min.js"></script>
        <script>
            $(document).ready(function(){
              $("button").click(function(){
                $("div").remove();
              });
            });
        </script>
        <style type="text/css">
            div {
                background-color: yellow;
            }
        </style>
    </head>
    <body>
        <div>
            <p>这是 div 元素中的段落。</p>
            <p>这是 div 元素中的段落。</p>
            <p>这是 div 元素中的段落。</p>
        </div>
        <button>删除div元素</button>
    </body>
</html>

情况2:利用children()+unwrap()方法

children() 方法返回被选元素的所有直接子元素。

unwrap() 方法删除被选元素的父元素。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="js/jquery-1.10.2.min.js"></script>
        <script>
            $(document).ready(function(){
              $("button").click(function(){
                $("div").children().unwrap();
              });
            });
        </script>
        <style type="text/css">
            div {
                background-color: yellow;
            }
        </style>
    </head>
    <body>
        <div>
            <p>这是 div 元素中的段落。</p>
            <p>这是 div 元素中的段落。</p>
            <p>这是 div 元素中的段落。</p>
        </div>
        <button>删除div元素</button>
    </body>
</html>


推荐的文章
# 发表我的评论
  /     /  
# 最近评论
暂时还没有评论,要不要说点什么?
网站地图
会员服务
关于我们
QQ:858353007
 
广告服务
加我微信
移动端访问
 
 
Copyright © 2014- 2022 www.mdaima.com All Rights Reserved.
李雷博客,专注PHP经验、PHP教程及PHP源代码开源下载分享的PHP博客!   ICP备案号:京ICP备10202169号