jQuery的DOM操作之删除节点示例


Posted in Javascript onJanuary 03, 2014

如果文档中某一个元素多余,那么应将其删除。jQuery提供了两种删除节点的方法,remove()方法和empty()方法。

1. remove():

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script src="jQuery/jquery-1.10.2.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("ul li:eq(1)").remove(); 
}); 
</script> 
</head> 
<body> 
<p title="what kind of fruit do you like best?">你最喜欢的水果是?</p> 
<ul> 
<li title="apple">苹果</li> 
<li title="orange">橘子</li> 
<li title="banana">香蕉</li> 
</ul> 
</body> 
</html>

jQuery的DOM操作之删除节点示例 

当某个节点用remove方法删除后,该节点所包含的所有后代节点将同时被删除。这个方法的返回值是一个指向已被删除的节点的引用。

另外remove()方法也可以通过传递参数来选择性地删除元素。

<script type="text/javascript"> 
$(document).ready(function(){ 
$("ul li").remove("li[title!=apple]"); 
}); 
</script>

jQuery的DOM操作之删除节点示例

2. empty():

严格来讲,empty方法并不是删除节点,而是清空节点,它能清空元素中的所有后代节点。

<script type="text/javascript"> 
$(document).ready(function(){ 
$("ul li:eq(1)").empty(); 
}); 
</script>

jQuery的DOM操作之删除节点示例 

此时查看页面源码:

jQuery的DOM操作之删除节点示例

Javascript 相关文章推荐
javascript 原型模式实现OOP的再研究
Apr 09 Javascript
JQUERY 实现窗口滚动搜索框停靠效果(类似滚动停靠)
Mar 27 Javascript
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
Sep 23 Javascript
js实现鼠标感应向下滑动隐藏菜单的方法
Feb 20 Javascript
基于jQuery实现仿51job城市选择功能实例代码
Mar 02 Javascript
设置jQueryUI DatePicker默认语言为中文
Jun 04 Javascript
JS匿名函数实例分析
Nov 26 Javascript
jQuery Validate验证框架详解(推荐)
Dec 17 Javascript
原生javascript实现分页效果
Apr 21 Javascript
javascript 面向对象实战思想分享
Sep 07 Javascript
vue eslint简要配置教程详解
Jul 26 Javascript
JavaScript封装单向链表的示例代码
Sep 17 Javascript
JQuery中dataGrid设置行的高度示例代码
Jan 03 #Javascript
JavaScript实现两个Table固定表头根据页面大小自行调整
Jan 03 #Javascript
js传中文参数controller里获取参数乱码问题解决方法
Jan 03 #Javascript
IE6下拉框图层问题探讨及解决
Jan 03 #Javascript
javascript 表格内容排序 简单操作示例代码
Jan 03 #Javascript
通过JS来判断页面控件是否获取焦点
Jan 03 #Javascript
使用js判断控件是否获得焦点
Jan 03 #Javascript
You might like
在php中取得image按钮传递的name值
2006/10/09 PHP
ADODB结合SMARTY使用~超级强
2006/11/25 PHP
php通过隐藏表单控件获取到前两个页面的url
2014/09/09 PHP
PHP操作mysql数据库分表的方法
2016/06/09 PHP
PHP编程实现微信企业向用户付款的方法示例
2017/07/26 PHP
PHP工厂模式的日常使用
2019/03/20 PHP
js浮动图片的动态效果
2013/07/10 Javascript
利用原生JavaScript获取元素样式只是获取而已
2014/10/08 Javascript
jQuery中parents()和parent()的区别分析
2014/10/28 Javascript
JavaScript常用脚本汇总(一)
2015/03/04 Javascript
jQuery中animate用法实例分析
2015/03/09 Javascript
javascript比较两个日期相差天数的方法
2015/07/24 Javascript
VUE2 前端实现 静态二级省市联动选择select的示例
2018/02/09 Javascript
jQuery实现新闻播报滚动及淡入淡出效果示例
2018/03/23 jQuery
Vue.js 表单控件操作小结
2018/03/29 Javascript
基于iview的router常用控制方式
2019/05/30 Javascript
Vue指令之 v-cloak、v-text、v-html实例详解
2019/08/08 Javascript
有关vue 开发钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案
2020/05/09 Javascript
详解Vue之计算属性
2020/06/20 Javascript
python数据结构之二叉树的遍历实例
2014/04/29 Python
python 接口_从协议到抽象基类详解
2017/08/24 Python
基于Python闭包及其作用域详解
2017/08/28 Python
pytest中文文档之编写断言
2019/09/12 Python
Pyqt助手安装PyQt5帮助文档过程图解
2020/11/20 Python
详解用 python-docx 创建浮动图片
2021/01/24 Python
Python中全局变量和局部变量的理解与区别
2021/02/07 Python
css3实现3D文本悬停改变效果的示例代码
2019/01/16 HTML / CSS
使用HTML5 Canvas API绘制弧线的教程
2016/03/22 HTML / CSS
新加坡时尚网上购物:Zalora新加坡
2016/07/26 全球购物
Jar包的作用是什么
2014/03/30 面试题
高中毕业生自我鉴定
2013/11/03 职场文书
纪念九一八事变演讲稿1000字
2014/09/14 职场文书
村党组织公开承诺书
2015/04/30 职场文书
小学教师教学反思
2016/02/24 职场文书
Nginx静态压缩和代码压缩提高访问速度详解
2022/05/30 Servers
Vite + React从零开始搭建一个开源组件库
2022/06/25 Javascript