(转载)Javascript removeChild()不能删除全部子节点的解决办法
在Javascript中,只提供了一种删除节点的方法:removeChild()。
removeChild() 方法用来删除父节点的一个子节点。
语法:
parent.removeChild(thisNode)
参数说明:
| 参数 | 说明 |
|---|---|
| thisNode | 当前节点,即要删除的节点 |
| parent | 当前节点的父节点,即 thisNode.parentNode |
例如,删除 id="demo" 的节点的语句为:
var thisNode=document.getElementById("demo");
thisNode.parentNode.removeNode(thisNode);
举例,删除节点:
<div id="demo">
<div id="thisNode">点击删除我</div>
</div>
<script type="text/javascript">
document.getElementById("thisNode").onclick=function(){
this.parentNode.removeChild(this);
}
可以看出来,虽然Javascript只提供了一种删除节点的方法,但是足够用了。
ps:JavaScript删除子节点的方法
HTML代码如下:
<div id="f">
<div>a</div>
<div>b</div>
<div>c</div>
</div>
如果想删除f节点下的所有子节点,很自然也很正常想到的方法应该就是下面的这段代码了:
var f = document.getElementById("f");
var childs = f.childNodes;
for(var i = 0; i < childs.length; i++) {
alert(childs[i].nodeName);
f.removeChild(childs[i]);
}
当程序运行后我们发现无论在FireFox还是在IE下,均不能完全的删除所有的子节点(FireFox中把空白区域也
当成节点,所以删除结点的结果会不一样的),这是因为当你把索引为0的子节点删除后那么很自然的原来索引
为1节点此时它的索引变成0了,而这时变量i已经变成1了,程序继续走时就会删除原先索引为2的现在为1的节点,
这样程序运行的结果就是只删除了一半的子节点,用for in遍历结果也是一样的。想正常的删除全部节点
的话,我们应该从后面往前删除,代码如下:
for(var i = childs.length - 1; i >= 0; i--) {
alert(childs[i].nodeName);
f.removeChild(childs[i]);
}
我们从索引最大值开始删除,采用递减的方法,这样索引便不会移动改变了。
原文地址:
Javascript removeChild()删除节点及删除子节点的方法
(转载)Javascript removeChild()不能删除全部子节点的解决办法的更多相关文章
- zTree实现删除树子节点
zTree实现删除树子节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</tit ...
- MySQL删除数据库时无响应解决办法
删除远程主机上MySQL中的一个数据库时,远程主机一直在响应,无法正常删除. 这个问题的解决办法如下:在远程主机上登录MySQL,执行show full processlist;观察state和inf ...
- Visual studio 2017中 Javascript对于Xrm对象模型没有智能提示的解决办法
Visual studio 2017中 Javascript对于Xrm对象模型没有智能提示的解决办法 先上个图.语法提示支持到 Microsoft Dynamics xRM API 8.2 也就是cr ...
- 全网最详细的Xshell或SecureCRT下spark-shell里出现无法退格或者删除的问题现象的解决办法(图文详解)
不多说,直接上干货! 前言 打开spark的命令行后,发现输错字符了,但是无法退格或者删除,这是比较苦恼的问题. 这个问题,得看你是用Xshell,还是SecureCRT. 一般是出现在SecureC ...
- 频繁加载、删除swf造成flash崩溃解决办法
最近在项目中遇到flash崩溃问题,经分析,都是在swfobject.embedSWF这一步卡死,页面及flash均无反应. 造成此问题的场景是,在同一根节点上频繁清空节点.调用swfobject ...
- 【转载】sudoers改坏后无法使用sudo的解决办法
练习安装odoo的时候,创建了一个odoo用户,想把它赋予sudo权限,然而,编辑的时候不留意,改坏了,导致sudo无法使用,无法编辑sudoers文件修改回来. 提示如下信息: >>&g ...
- Linux无法使用userdel删除用户和组的解决办法
转自:http://www.linuxidc.com/Linux/2013-07/87371.htm 简述: 今天在看书的时候,看到有个实例,手痒痒的跟着做了起来...但是,出现问题了..测试的用户和 ...
- lnmp无法删除.user.ini文件的解决办法
有一次使用命令lnmp vhost del删除虚拟主机后,需要使用ftp或者rm命令删除网站目录,但是却发现网站目录下有个文件.user.ini文件没有自动删除,出现提示rm: cannot remo ...
- 关于My Sql update语句不能用子查询的解决办法
在使用My Sql数据库语法操作update时,第一时间想到的是一下写法: UPDATE purchase_request_detail SET convert_to_voucher_id=, con ...
随机推荐
- 扩展gridview轻松实现冻结行和列
在实际的项目中,由于项目的需要,数据量比较大,同时显示栏位也比较多,要做gridview里显示完整,并做到用户体验比较好,这就需要冻结表头和关键列.由于用到的地方比较多,我们可以护展一个gridvie ...
- 【InteillJ IDEA】Git的安装+同步项目到GitHub上
需要的工具: 1.InteillJ IDEA 2.Git 3.GitHub帐号 步骤: 1.下载Git 下载地址:https://git-scm.com/downloads 安装完成后 勾选Launc ...
- 【java】子类可以通过调用父类的public方法调用父类的private方法,为什么?
代码1: 打印结果: 代码2: 运行结果: 问题: 代码1中super是父类自己调用自己的add()方法,并在add()方法中调用了私有的del()方法,那为什么打印出来的this是子类? 代码2中t ...
- Hadoop之Sqoop详解
sqoop数据迁移1.简介 sqoop是apache旗下一款“Hadoop和关系数据库服务器之间传送数据”的工具. 导入数据:MySQL,Oracle导入数据到Hadoop的HDFS.HIVE.HBA ...
- 使用IntelliJ IDEA创建Maven多模块项目
转载:http://blog.csdn.net/xyw591238/article/details/52794788 使用Maven管理项目时,往往需要创建多个模块,模块之间存在相互引用的关系.对于M ...
- IT痴汉的工作现状21-Android开发前景论
饭间闲谈 齐天.周权和我是饭搭子.总是边吃边聊一些与技术.汽车和女人相关的话题. "前阵子Nokia裁员之事不知道完没完?这艾洛普挺能作啊."我吃着香喷喷的过桥米线说." ...
- kyeremal-bzoj2038-[2009国家集训队]-小z的袜子(hose)-莫队算法
id=2038">bzoj2038-[2009国家集训队]-小z的袜子(hose) F.A.Qs Home Discuss ProblemSet Status Ranklist Con ...
- c# 用OpenXmL读取.xlsx格式的Excel文件 返回DataTable
1.须要引用的dll : DocumentFormat.OpenXml.dll ---须要安装一下OpenXml再引用 WindowsBase ---直接在项目里加入引用 2.方法: /// & ...
- .NET--百度百科
.NET是 Microsoft XML Web services 平台.XML Web services 允许应用程序通过 Internet 进行通讯和共享数据,而不管所采用的是哪种操作系统.设备或编 ...
- Android Exception 15(关于使用RecyclerView的异常)
04-07 16:32:32.815: E/AndroidRuntime(16173): FATAL EXCEPTION: main 04-07 16:32:32.815: E/AndroidRunt ...