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. hdu 饭卡

    本题的思路是:首先如果m<5,直接输出:若m>5,则先拿出5元钱买最贵的东西,这样背包容量就变成了m-5,商品数量为n-1的0/1背包问题. 此题的状态转移方程为:dp[j]=max{dp ...

  2. lucene 3.0.2 search 各种各样的Query类型

    http://blog.sina.com.cn/s/blog_61d2047c010195mo.html     lucene的这种各种各样的查询类型 1.TermQuery       最简单的Qu ...

  3. fastjson解析任意json

    fastjson解析任意json到bean 解析案例的代码 package com.base.config; import java.util.List; import com.alibaba.fas ...

  4. Spring对加载的bean之间循环依赖的处理

    根据下面文档的叙述,简言之: 对于相互之间通过构造函数注入相互循环依赖的情况,Spring会抛出BeanCurrentlyInCreationException错误. 如果AB两个beans是通过属性 ...

  5. DS实验题 Old_Driver UnionFindSet结构 指针实现邻接表存储

    题目见前文:DS实验题 Old_Driver UnionFindSet结构 这里使用邻接表存储敌人之间的关系,邻接表用指针实现: // // main.cpp // Old_Driver3 // // ...

  6. Yii源码阅读笔记（二）

    接下来阅读BaseYii.php vendor/yiisoft/yii2/BaseYii.php—— namespace yii; use yii\base\InvalidConfigExceptio ...

  7. DateTime Related Functions

    string a = "to_date('" + dtpStart.Value.ToString("yyyy/MM/dd") + "', 'yyyy/ ...

  8. CLI下另一种多进程实现方式----PCNTL

    有些时候,你需要对一些脚本进行优化,以期跑的更快,在更短的时间内完成任务.PCNTL是一个不错的选择,它可以fork多个进程,来协同完成一个任务,理论上完成的时间将会和进程数成反比. 不过,PCNTL ...

  9. XPath学习:轴(14)——总结

    原文地址:http://www.cnblogs.com/zhaozhan/archive/2009/09/10/1564396.html XPath 是一门在 XML 文档中查找信息的语言.XPath ...

  10. Java 判断图片资源的存在否

    question: 如题,举个例子吧 String image ="http://info-database.csdn.net/Upload/2010-10-30/735-60sap1030 ...