jQuery之移除元素方法
jQuery之移除元素方法
一.empty()方法
从DOM中移除集合中匹配元素的所有子节点。
示例:
<div class="container"><div class="hello">Hello</div><div class="goodbye">Goodbye</div>
</div>
移除方法:
$('.hello').empty();
效果:
<div class="container"><div class="hello"></div><div class="goodbye">Goodbye</div>
</div>
如果
为了避免内存泄漏,jQuery先移除子元素的数据和事件处理函数,然后移除子元素
二.remove()方法:
描述: 将匹配元素集合从DOM中删除。(同时移除元素上的事件及 jQuery 数据。)
和 .empty()相似。.remove() 将元素移出DOM。 当我们想将元素自身移除时我们用 .remove(),同时也会移除元素内部的一切,包括绑定的事件及与该元素相关的jQuery数据
示例:
<div class="container"><div class="hello">Hello</div><div class="goodbye">Goodbye</div>
</div>
移除方法:
$('.hello').remove();
或者用
$('div').remove('.hello');
效果:
<div class="container"><div class="goodbye">Goodbye</div>
</div>
也就是说 class对应的自身的div也移除了
三.detach()方法:
从DOM中去掉所有匹配的元素
detach() 方法和.remove()一样, 除了 .detach()保存所有jQuery数据和被移走的元素相关联。当需要移走一个元素,不久又将该元素插入DOM时,这种方法很有用。
四.html(“”)方法:
html() 方法如果未设置参数,则返回被选元素的当前内容。html(“”) 则清空被选元素的当前内容。
empty() 方法从被选元素移除所有内容,包括所有文本和子节点。
两者最终实现的效果是一样的
html()返回值:String 也就是说是可以用变量接收的
empty()返回值:jQuery 不能用变量接收
另外:
empty()方法无参数,而且清空后的子集及文本无法进行还原。而detach()和remove()方法可以将其保存在一个变量中
如声明变量p 写成如下形式
var p=$('p').remove();
当需要从新添加时可以直接添加如下
p.appendTo("body");
这是detach()和remove()方法都有的功能。remove()较detach()不同的是remove()可以删除指定的类如remove(‘a’),而detach()不可这样操作,还要注意一点,当用remove()方法移除元素后,再进行添加,再子集的事件的不会存在,而detach()子集的事件还可执行。
参考文章:
https://www.cnblogs.com/lisongy/p/4109420.html
https://zhidao.baidu.com/question/208078391.html
jQuery之移除元素方法相关推荐
- jq添加或删除html元素,jQuery添加删除DOM元素方法详解
本文实例分析了jQuery添加删除DOM元素的方法.分享给大家供大家参考,具体如下: 介绍 DOM是Document Object Modeule的缩写,一般来说,DOM操作分成3个方面. 1.DOM ...
- JS/Jquery 中移除子元素的问题
1.前端样式: <p id="p1" class="card-description"><code>商品信息</code>& ...
- JQuery替换和删除元素
1.replaceWith方法 用提供的内容替换集合中所有匹配的元素并且返回被替换元素的集合 参数类型说明: 1)普通字符串(可包含各种html标签) 2)jQuery对象 ①使用函数创建的新元素(j ...
- 代码随想录Day01:数组理论基础、二分查找、移除元素
目录 数组理论基础.二分查找.移除元素 1.数组理论基础 2.Leetcode704.二分查找 方法一 左闭右闭: 方法二 左闭右开: 方法三 左开右开: 方法四 左开右闭: 3.Leetcode27 ...
- jquery追加html及移除,jQuery 添加元素和删除元素的方法
添加新的 HTML 内容 我们将学习用于添加新内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在 ...
- jQuery unbind 删除绑定事件 / 移除标签方法
jQuery unbind 删除绑定事件 unbind([type],[data]) 是 bind()的反向操作,从每一个匹配的元素中删除绑定的事件.如果没有参数,则删除所有绑定的事件.你可以将你用b ...
- 添加元素的注意问题 复习 介绍 元素的创建 元素添加的方法 元素移除的方法
添加元素的注意问题 <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...
- php 获取子孙,jquery如何查找后代元素?jquery获取后代元素方法
在上一篇我们讲到jquery获取父元素?相信你已经学会了,那么下面我们来讲一下jquery如何查找后代元素?jquery获取后代元素方法. 一: 查找后代元素三种方法 (1)children(): ( ...
- jQuery中添加元素删除元素的方法
开发工具与关键技术:VS.jQuery 作者:#33 撰写时间:撰写时间:2019年06月06日 jQuery添加元素的方法和移除元素的方法: 引入jQuery插件: <script src= ...
最新文章
- 关于Cloud各种组件的停更/升级/替换
- 2020 操作系统第零天复习(知识点总结)
- php表单服务器验证失败,php 表单验证代码(验证失败显示提示信息)
- 最长连续序列—leetcode128
- 依赖: ros-melodic-desktop 但是它将不会被安装_npm系列之依赖管理
- 一句话加速grep近30倍
- 插件怎么用_【Anki插件篇】(01)插件介绍
- 从起始点到目标点的最短步数(BFS)
- rk399_android7.1的mipi驱动代码追踪(部分)
- 吴恩达深度学习——人脸识别与神经风格转换
- HTML注册登录页面模板JS
- php源码安装图文教程_安装PHP的教程及说明(图文详解)
- 张爱玲的 因为懂得,所以慈悲 如何理解
- 笑话大全API 实战项目 开心一笑app
- R语言与点估计学习笔记(矩估计与MLE)
- Cisco测试命令和TCP/IP连接故障处理整理集合
- eclipse 同时打开两个
- Go调用Python by go-python3
- Proxmox VE(PVE) 进行网卡直通
- java猜数字游戏课程设计报告_Java程序设计课程设计-猜数字游戏设计.doc
热门文章
- ashx需要编译吗_创建安全的ashx文件,ashx编译
- 淘宝店铺运营经验分享,有哪些因素会影响到宝贝的转换率,怎么做才能提高转化
- 常用対插式连接器01——德驰防水连接器
- 产品分享:Qt+Arm基于RV1126平台的内窥镜软硬整套解决方案(实时影像、冻结、拍照、录像、背光调整、硬件光源调整,其他产品也可使用该平台,如视频监控,物联网产品等等)
- 数据结构之HashMap详解(一)
- Rust语言——cargo
- EasyExcel设置特定单个单元格(颜色)样式
- 锐博提示:新股民不能碰那些股票
- html顶部边距代码_html5右边距
- You辉编程_kafka