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;width: 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;width: 130px;height: 50px;">

            <ol>

                <li>第一段话</li>

                <li>第二段话</li>

            </ol>

        </div>

        <button>点击</button>

    </body>

</html>

jQuery文档操作--empty()和remove()的更多相关文章

  1. jQuery文档操作

    jQuery文档操作 1.jq文档结构 var $sup = $('.sup'); $sup.children(); // sup所有的子级们 $sup.parent(); // sup的父级(一个, ...

  2. jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法

    原文地址:http://www.w3school.com.cn/jquery/manipulation_detach.asp   实例 使用 noConflict() 方法为 jQuery 变量规定新 ...

  3. HTML jQuery 文档操作 - html() 方法

    jQuery 文档操作 - html() 方法 jQuery 文档操作参考手册 实例 设置所有 p 元素的内容: $(".btn1").click(function(){ $(&q ...

  4. jQuery 效果函数，jquery文档操作，jQuery属性操作方法，jQuerycss操作函数，jQuery参考手册-事件，jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  5. 前端之JQuery：JQuery文档操作

    jquery之文档操作 一.相关知识点总结1.CSS .css() - .css("color") -> 获取color css值 - .css("color&qu ...

  6. jQuery 文档操作 - prependTo() ，appendTo()方法

    其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...

  7. jQuery文档操作--append()、prepend()、after()和before()

       append(content|fn)  概述 向每个匹配的元素内部追加内容,这个操作与对指定的元素执行appendChild方法,将它们添加到文档中的情况类似 参数    content  要追 ...

  8. jQuery 文档操作 - remove() 方法

    移除所有 <p> 元素: 定义和用法 remove() 方法移除被选元素,包括所有文本和子节点. 该方法不会把匹配的元素从 jQuery 对象中删除,因而可以在将来再使用这些匹配的元素. ...

  9. jQuery 文档操作

    一.插入操作 1. 父元素.append(子元素) 追加某元素,在父元素中添加新的子元素, 子元素可以为: stirng / element (js对象) / jquery 元素 var oli = ...

随机推荐

  1. 使用axios加入进度条

    思路:(安慰剂按钮)首先当触发按钮时,设置拦截器,启动进度条从0开始到100满(html进度条用数值value来控制,默认为0),设置进度条的配置函数然后在后端返回函数中启动停止精度条的函数,为了保持 ...

  2. Mongodb的下载和安装

    下载 下载地址:http://dl.mongodb.org/dl/win32/x86_64  说明:zip是解压版的,msi是安装版的:安装过程中不知道什么原因3.6.x版本的安装会时等待时间很长并且 ...

  3. Maven基本介绍及安装

    什么是Maven 是一个跨平台的项目管理工具. 跨平台是指它几乎可以在现有所有流行的操作系统中运行 maven不仅可以构建项目,还可以依赖管理和项目信息管理 Maven解决了什么问题 maven解决了 ...

  4. Web项目开发中常见安全问题防范

    本文章纯粹是个人收藏,其中各种也是略略了解,下面直接贴出知识点./捂脸/捂脸 计算机程序主要就是输入/输出,安全问题由此产生,凡是有输入的地方都可能带来安全风险.根据输入的数据类型,web应用主要有数 ...

  5. 剑指offer-矩阵覆盖

    题目描述 我们可以用2*1的小矩形横着或者竖着去覆盖更大的矩形.请问用n个2*1的小矩形无重叠地覆盖一个2*n的大矩形,总共有多少种方法?   使用dp,当n时,选着竖着放一个,那么后面的可能性为f( ...

  6. 火币网API文档——REST 行情、交易API简介

    REST API 简介 火币为用户提供了一套全新的API,可以帮用户快速接入火币PRO站及HADAX站的交易系统,实现程序化交易. 访问地址 适用站点 适用功能 适用交易对 https://api.h ...

  7. what's the 数据结构

    目录 栈 队列 链表与双向链表 哈希表  二叉搜索树 what's the 数据结构 数据结构是指相互之间存在着一种或多种关系的数据元素的集合和该集合中数据元素之间的关系组成. 简单来说,数据结构就是 ...

  8. mysql连接池不能回避的wait timeout问题（转）

    起因 我们的项目组一直在使用albianj作为开发框架在开发应用.使用至今倒也是没有出现很大的问题,但最近加过监控的接口基本上都会在使用一段时间后,突然之间执行数据库操作变得很慢.虽然会变慢,但持续的 ...

  9. IE8“开发人员工具”（下）

    浏览器模式 说白了,就是让用户选择当前页面用何种IE版本去渲染. 文本模式 说起“文本模式”这个名词,这又要回到渲染页面的3种模式了:诡异模式(Quirks mode,也有翻译为兼容模式.怪异模式的) ...

  10. H5-FileReader实现图片预览&Ajax上传文件

    图片预览 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...