JQuery:删除元素
通过 jQuery，可以很容易地删除已有的 HTML 元素、删除元素/内容。
如需删除元素和内容，一般可使用以下两个 jQuery 方法：
 remove() - 删除被选元素（及其子元素）
 empty()  - 从被选元素中删除子元素
1、jQuery remove() 方法
　  jQuery remove() 方法删除被选元素及其子元素。
     实例：$("#div1").remove();
代码如下：

<!DOCTYPE html>

<html lang="zh-cn">

<head>

    <meta charset="utf-8">

    <title>JQuery的使用！！！</title>

    <script src="jquery-3.1.0.js"></script>

    <script>

        $(document).ready(function(){

            //删除div元素

            $("button").click(function(){

                $("#div").remove();

            });

        });

    </script>

</head>

<body>

    <div id="div" style="width:200px;height:100px;background-color:yellow;border:1px solid;text-align:center">

        这是div中的一些文本

        <p>这是div中一行段落</p>

        <p>这是div中另一行段落</p>

    </div><br>

    <button>删除div元素</button>

</body>

</html>

 

2、jQuery empty() 方法
     jQuery empty() 方法删除被选元素的子元素。
     实例：$("#div1").empty();
代码如下：

<!DOCTYPE html>

<html lang="zh-cn">

<head>

    <meta charset="utf-8">

    <title>JQuery的使用！！！</title>

    <script src="jquery-3.1.0.js"></script>

    <script>

        $(document).ready(function(){

            //清空div元素

            $("button").click(function(){

                $("#div").empty();

            });

        });

    </script>

</head>

<body>

    <div id="div" style="width:200px;height:100px;background-color:yellow;border:1px solid;text-align:center">

        这是div中的一些文本

        <p>这是div中一行段落</p>

        <p>这是div中另一行段落</p>

    </div><br>

    <button>清空div元素</button>

</body>

</html>

 

3、过滤被删除的元素
    jQuery remove() 方法也可接受一个参数，允许您对被删元素进行过滤。
    该参数可以是任何 jQuery 选择器的语法。
    下面的例子删除 class="italic" 的所有 <p> 元素：
实例：$("p").remove(".italic");
代码如下：

<!DOCTYPE html>

<html lang="zh-cn">

<head>

    <meta charset="utf-8">

    <title>JQuery的使用！！！</title>

    <script src="jquery-3.1.0.js"></script>

    <script>

        $(document).ready(function(){

            //移除所有class="italic"的p元素

            $("button").click(function(){

                $("p").remove(".italic");

            });

        });

    </script>

</head>

<body>

    <div id="div" style="width:200px;height:100px;background-color:yellow;border:1px solid;text-align:center">

        这是div中的一些文本

        <p class="italic">这是div中一行段落</p>

        <p class="italic">这是div中另一行段落</p>

    </div><br>

    <button>移除所有class="italic"的p元素</button>

</body>

</html>

  

JQuery：JQuery删除元素的更多相关文章

  1. jQuery添加删除元素

    $(document).ready(function () { $('#radioExtranet').on('click', function () { showProjectInformation ...

  2. Jquery中删除元素方法

    empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除 语法: empty() remove(expr); empty用来删除指定元素的子元素,remove用来删除元素 ...

  3. 分别使用原生js和jQuery添加/删除元素的class属性

    一.原生js添加/删除元素的class属性: <!-- span元素原有class = "test" --> <span class="test&quo ...

  4. jquery操作删除元素

    通过 jQuery,可以很容易地删除已有的 HTML 元素. 删除元素/内容 如需删除元素和内容,一般可使用以下两个 jQuery 方法: remove() - 删除被选元素(及其子元素) empty ...

  5. jQuery添加/删除元素

    jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容(仍然该元素的内部). 追加前:<p>这是一个文本段落</p> $(" ...

  6. jquery数组删除指定元素的方法:grep()

    jquery数组删除指定元素的方法:grep() 金刚 数组 jquery javascript 元素 遇到的问题 今天遇到一个问题,删除数组中的一个指定元素,并返回新的数组. 我定义的js数组是这样 ...

  7. JQUERY添加、删除元素、eq()方法；

    一.jQuery - 添加元素 1.append() - 在被选元素内部的结尾插入指定内容 2.prepend() - 在被选元素内部的开头插入指定内容 3.after() - 在被选元素之后插入内容 ...

  8. jQuery 添加元素和删除元素

    jQuery - 添加元素 append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元 ...

  9. JavaScript（20）jQuery HTML 加入和删除元素

    jQuery - 加入元素 通过 jQuery,能够非常easy地加入新元素/内容. 加入新的 HTML 内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepen ...

随机推荐

  1. mysql时该如何估算内存的消耗，公式如何计算？

    经常有人问配置mysql时该如何估算内存的消耗.那么该使用什么公式来计算呢? 关心内存怎么使用的原因是可以理解的.如果配置mysql服务器使用太少的内存会导致性能不是最优的;如果配置了太多的内存则会导 ...

  2. [转]一步一步asp.net_购物车订单与支付宝

    本文转自:http://www.cnblogs.com/mysweet/archive/2012/05/19/2508534.html 最近这几天很忙,一边忙着准备一堆课程设计(8门专业课.....伤 ...

  3. 【iBoard电子学堂开发板例程】【12个 stm32 例程发布】

    _____________________________________ 深入交流QQ群: A: 204255896(1000人超级群,可加入) B: 165201798(500人超级群,满员) C ...

  4. jQuery Ajax 确定 form 表单 submit 提交成功

    使用 jQuery 提交表单,可以使用 同步方式(async: false). a.html 是 html 文件,a.php 是服务端文件,把 a.html 中表单的数据提交到 a.php 中,在提交 ...

  5. 获取在attr.xml中声明的主题样式

    在换肤时,先在attr.xml中定义Resource的属性名,再到stytle中,根据不同的主题,给属性赋值. 在布局文件中可直接以  android:background="?attr/a ...

  6. 浏览器 user-agent 字符串的故事

    你是否好奇标识浏览器身份的User-Agent,为什么每个浏览器都有Mozilla字样? 故事还得从头说起,最初的主角叫NCSA Mosaic,简称Mosaic(马赛克),是1992年末位于伊利诺伊大 ...

  7. RT-Thread的线程间同步

    禁止系统调度上一节< 多线程导致的临界区问题>中由于 test1 线程被 test2 线程打断,才导致了我们没有得到预期的结果,我们一般可通过关闭中断和调度器上锁这两种简单的途径来禁止系统 ...

  8. C#创建Excel

    创建Workbook说白了就是创建一个Excel文件,当然在NPOI中更准确的表示是在内存中创建一个Workbook对象流. 本节作为第2章的开篇章节,将做较为详细的讲解,以帮助NPOI的学习者更好的 ...

  9. 1 2 3 n

    n(n+1)/2 连续自然数 1,2,3.....,n 队列 从中任意取出1至n个相加,可以表示的连续自然数队列中最大的自然数是多少 受"高斯求和--蛇头蛇尾脑图--长方形对角线脑图--苯环 ...

  10. Flink - FlinkKafkaConsumer08

      先看 AbstractFetcher 这个可以理解就是,consumer中具体去kafka读数据的线程,一个fetcher可以同时读多个partitions的数据来看看 /** * Base cl ...