jQuery删除/清空指定元素的所有子节点实例代码


Posted in jQuery onJuly 04, 2019

前言

我们知道可以利有jQuery中的detach()方法和jQuery中的remove()方法删除指定的或是匹配的元素,也可以使用removeClass()方法以及removeAttr()方法删除指定或是匹配元素的类或是属性。那么我们今天说一说利用jQuery如果删除指定或匹配的元素内的子元素和节点!

jQuery中empty()方法的解释

jQuery中的empty()方法:些方法可以清空/删除指定元素下的所以子节点或是内容

语法:

$(selector).empty()

举个大大的“例”字

利用jQuery中的empty()方法移去DIV中的所有内容

jQuery删除/清空指定元素的所有子节点实例代码

HTML代码

<div id="mochu">
  <p>这里是P标签内容</p>
  <p>这里是第二个P标签的内容</p>
</div>

JQ代码

$('#button').click(function(){
  $("#mochu").empty();
})

结果图示

审核源码如下图所示

jQuery删除/清空指定元素的所有子节点实例代码

通过上图我们可以发现,ID为mochu的div标签,里面的P标签和内容都已被删除!

作者有话说

写这篇文章的时候,查阅了三个文档,其中一个文档这样说的,empty()函数应理解为清空指定元素下的子节点,并不是删除指定元素下的子节点。关于这一点,大家看着理解吧。我个人认为,还是清空比较恰当一些!

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

jQuery 相关文章推荐
BootStrap中jQuery插件Carousel实现轮播广告效果
Mar 27 jQuery
jQuery实现select下拉框获取当前选中文本、值、索引
May 08 jQuery
jQuery日期范围选择器附源码下载
May 23 jQuery
jquery在vue脚手架中的使用方式示例
Aug 29 jQuery
jQuery获取所有父级元素及同级元素及子元素的方法(推荐)
Jan 21 jQuery
jQuery实现的下雪动画效果示例【附源码下载】
Feb 02 jQuery
vue.js2.0点击获取自己的属性和jquery方法
Feb 23 jQuery
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 jQuery
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
Mar 19 jQuery
jquery弹窗时禁止body滚动条滚动的例子
Sep 21 jQuery
9种方法优化jQuery代码详解
Feb 04 jQuery
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 jQuery
JQuery+Bootstrap 自定义全屏Loading插件的示例demo
Jul 03 #jQuery
jQuery属性选择器用法实例分析
Jun 28 #jQuery
jQuery位置选择器用法实例分析
Jun 28 #jQuery
jQuery层叠选择器用法实例分析
Jun 28 #jQuery
jQuery内容选择器与表单选择器实例分析
Jun 28 #jQuery
jQuery子选择器与可见性选择器实例分析
Jun 28 #jQuery
基于jQuery的时间戳与日期间的转化
Jun 21 #jQuery
You might like
JAVA/JSP学习系列之七
2006/10/09 PHP
PHP 基于文件头的文件类型验证类函数
2012/05/01 PHP
SESSION信息保存在哪个文件目录下以及能够用来保存什么类型的数据
2012/06/17 PHP
apache+codeigniter 通过.htcaccess做动态二级域名解析
2012/07/01 PHP
thinkPHP2.1自定义标签库的导入方法详解
2016/07/20 PHP
DEDE实现转跳属性文档在模板上调用出转跳地址
2016/11/04 PHP
PHP面向对象程序设计高级特性详解(接口,继承,抽象类,析构,克隆等)
2016/12/02 PHP
PHP+redis实现的购物车单例类示例
2019/02/02 PHP
PHP pthreads v3下的Volatile简介与使用方法示例
2020/02/21 PHP
ExtJS 2.0实用简明教程 之Border区域布局
2009/04/29 Javascript
写出更好的JavaScript之undefined篇(上)
2009/11/22 Javascript
javascript 兼容所有浏览器的DOM扩展功能
2012/08/01 Javascript
jquery任意位置浮动固定层插件用法实例
2015/05/29 Javascript
jQuery代码实现图片墙自动+手动淡入淡出切换效果
2016/05/09 Javascript
jquery实现文字单行横移或翻转(上下、左右跳转)
2017/01/08 Javascript
React 组件中的 bind(this)示例代码
2018/09/16 Javascript
简化版的vue-router实现思路详解
2018/10/19 Javascript
微信小程序防止多次点击跳转(函数节流)
2019/09/19 Javascript
Layui数据表格 前后端json数据接收的方法
2019/09/19 Javascript
node.js使用fs读取文件出错的解决方案
2019/10/23 Javascript
小程序实现录音功能
2020/09/22 Javascript
[04:51]TI10典藏宝瓶Ⅱ外观视频展示
2020/08/15 DOTA
详解C++编程中一元运算符的重载
2016/01/19 Python
浅谈Python脚本开头及导包注释自动添加方法
2018/10/27 Python
Python3中编码与解码之Unicode与bytes的讲解
2019/02/28 Python
python Pandas库基础分析之时间序列的处理详解
2019/07/13 Python
python实现逆滤波与维纳滤波示例
2020/02/26 Python
使用HTML5原生对话框元素并轻松创建模态框组件
2019/03/06 HTML / CSS
印尼最大的网上书店:Gramedia.com
2018/09/13 全球购物
澳大利亚在线床零售商:Bedworks
2020/09/01 全球购物
银行服务明星推荐材料
2014/05/29 职场文书
群众路线教育实践活动剖析材料
2014/09/30 职场文书
医院员工辞职信范文
2015/05/12 职场文书
《分一些蚊子进来》读后感3篇
2020/01/09 职场文书
Vue如何实现组件间通信
2021/05/15 Vue.js
教你如何用cmd快速登录服务器
2022/06/10 Servers