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优化技巧(文件瘦身篇)
Jan 28 Javascript
parseInt parseFloat js字符串转换数字
Aug 01 Javascript
Javascript 浮点运算的问题分析与解决方法
Aug 27 Javascript
动态加载iframe时get请求传递中文参数乱码解决方法
May 07 Javascript
JavaScript实现动态添加,删除行的方法实例详解
Jul 02 Javascript
JavaScript文本框脚本编写的注意事项
Jan 25 Javascript
基于Vue如何封装分页组件
Dec 16 Javascript
使用JS获取SessionStorage的值
Jan 12 Javascript
React 组件中的 bind(this)示例代码
Sep 16 Javascript
JS实现电话号码的字母组合算法示例
Feb 26 Javascript
JavaScript代理模式原理与用法实例详解
Mar 10 Javascript
JavaScript面向对象核心知识与概念归纳整理
May 09 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文件打开、关闭、写入的判断与执行代码
2011/05/24 PHP
PHP中两个float(浮点数)比较实例分析
2015/09/27 PHP
8个必备的PHP功能开发
2015/10/02 PHP
PHP Cookei记录用户历史浏览信息的代码
2016/02/03 PHP
关于PHP中字符串与多进制转换函数的实例代码
2016/11/03 PHP
php实现文件上传及头像预览功能
2017/01/15 PHP
javascript setAttribute, getAttribute 在不同浏览器上的不同表现
2010/08/05 Javascript
javascript 广告后加载,加载完页面再加载广告
2010/11/25 Javascript
使用JavaScript链式编程实现模拟Jquery函数
2014/12/21 Javascript
在JS中操作时间之getUTCMilliseconds()方法的使用
2015/06/10 Javascript
javascript数据结构之二叉搜索树实现方法
2015/11/25 Javascript
基于JSON格式数据的简单jQuery幻灯片插件(jquery-slider)
2016/08/10 Javascript
vue2.0 中#$emit,$on的使用详解
2017/06/07 Javascript
JavaScript箭头函数_动力节点Java学院整理
2017/06/28 Javascript
javascript基于牛顿迭代法实现求浮点数的平方根【递归原理】
2017/09/28 Javascript
js实现动态添加上传文件页面
2018/10/22 Javascript
在mpvue框架中使用Vant WeappUI组件库的注意事项【推进】
2019/06/09 Javascript
koa2的中间件功能及应用示例
2020/03/05 Javascript
微信小程序多列表渲染数据开关互不影响的实现
2020/06/05 Javascript
Python中最常用的操作列表的几种方法归纳
2015/04/24 Python
Python functools模块学习总结
2015/05/09 Python
Python常用的文件及文件路径、目录操作方法汇总介绍
2015/05/21 Python
在java中如何定义一个抽象属性示例详解
2017/08/18 Python
Python实现生成随机日期字符串的方法示例
2017/12/25 Python
Python实现可自定义大小的截屏功能
2018/01/20 Python
python3中替换python2中cmp函数的实现
2019/08/20 Python
python通过nmap扫描在线设备并尝试AAA登录(实例代码)
2019/12/30 Python
可能这些是你想要的H5软键盘兼容方案(小结)
2019/04/23 HTML / CSS
eDreams澳大利亚:预订机票、酒店和度假产品
2017/04/19 全球购物
优秀员工个人的自我评价
2013/11/29 职场文书
经理秘书找工作求职信
2013/12/19 职场文书
公司会计主管岗位责任制
2014/03/01 职场文书
2014年惩防体系建设工作总结
2014/12/01 职场文书
2015年物业公司保洁工作总结
2015/10/22 职场文书
修辞手法有哪些?
2019/08/29 职场文书
解析高可用Redis服务架构分析与搭建方案
2021/06/20 Redis