JavaScript 存在陷阱 删除某一区域所有节点


Posted in Javascript onMay 10, 2010

比较简单的,例如:有一区域<div id="newbody" ></div>,现要求删除其中所有节点。相信很多人会这样写:

var divpanel = document.getElementById("newbody"); 
var controlinfo= divpanel.childNodes; 
for(var index = 0;index < controlinfo.length ;index++) 
{ 
divpanel.removeChild(controlinfo[index]); 
}

咋一看,是啊,对啊,这样很正确啊,一个一个遍历,最后全部删除。但是,仔细想想,每当删除一个节点后,controlinfo.length就会变小,这样下去是不能全部删除的——存在Bug。那么该如何改进呢?已经很清楚了,既然从开头Start不行,那我们就从结尾Start,完全正确,如下:
var divpanel = document.getElementById("newbody"); 
var controlinfo= divpanel.childNodes; 
for(var index = controlinfo.length - 1;index >= 0 ;index--) 
{ 
divpanel.removeChild(controlinfo[index]); 
}

调试,Very Good!

这种陷阱不只是在JavaScript中才会碰到,基本上所有的语言,如C#、Java等,我们都会碰到这样的问题,有时会因为这样的问题而浪费很多的时间。很早就已经知道了这个问题,不过总是太相信自己的记忆,而没有好好记录,现在特记录下来,警示自己,同时也与大家分享。

Javascript 相关文章推荐
js类中的公有变量和私有变量
Jul 24 Javascript
JavaScript 判断日期格式是否正确的实现代码
Jul 04 Javascript
jQuery判断元素上是否绑定了指定事件的方法
Mar 17 Javascript
基于jQuery Circlr插件实现产品图片360度旋转
Sep 20 Javascript
微信小程序前端源码逻辑和工作流
Sep 25 Javascript
简单实现IONIC购物车功能
Jan 10 Javascript
解决vue-cli中stylus无法使用的问题方法
Jun 19 Javascript
如何去除vue项目中的#及其ie9兼容性
Jan 11 Javascript
分享ES6的7个实用技巧
Jan 18 Javascript
Javascript获取某个月的天数
May 30 Javascript
用Fundebug插件记录网络请求异常的方法
Feb 21 Javascript
jquery实现淡入淡出轮播图效果
Dec 13 jQuery
js 小数取整的函数
May 10 #Javascript
Javascript异步表单提交,图片上传,兼容异步模拟ajax技术
May 10 #Javascript
javascript转换字符串为dom对象(字符串动态创建dom)
May 10 #Javascript
JavaScript几种形式的树结构菜单
May 10 #Javascript
js function使用心得
May 10 #Javascript
javascript 模式设计之工厂模式详细说明
May 10 #Javascript
javascript 精粹笔记
May 09 #Javascript
You might like
使用eAccelerator加密PHP程序
2008/10/03 PHP
php 远程关机操作的代码
2008/12/05 PHP
PHP 函数执行效率的小比较
2010/10/17 PHP
php防止用户重复提交表单
2015/11/02 PHP
PHP中Enum(枚举)用法实例详解
2015/12/07 PHP
jQuery学习笔记 更改jQuery对象
2012/09/19 Javascript
第四章之BootStrap表单与图片
2016/04/25 Javascript
详解Vue用axios发送post请求自动set cookie
2017/05/10 Javascript
js中split()方法得到的数组长度问题
2018/07/19 Javascript
写一个Vue Popup组件
2019/02/25 Javascript
详解如何使用微信小程序云函数发送短信验证码
2019/03/13 Javascript
微信小程序中使用echarts的实现方法
2019/04/24 Javascript
vue slot与传参实例代码讲解
2019/04/28 Javascript
使用typescript构建Vue应用的实现
2019/08/26 Javascript
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
2019/08/27 jQuery
js实现AI五子棋人机大战
2020/05/28 Javascript
[03:18]DOTA2放量测试专访820:希望玩家加入国服大家庭
2013/08/25 DOTA
[01:07:41]IG vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
java直接调用python脚本的例子
2014/02/16 Python
Python网络编程中urllib2模块的用法总结
2016/07/12 Python
Python3实现将本地JSON大数据文件写入MySQL数据库的方法
2018/06/13 Python
使用Python如何测试InnoDB与MyISAM的读写性能
2018/09/18 Python
基于OpenCV python3实现证件照换背景的方法
2019/03/22 Python
Python基于类路径字符串获取静态属性
2020/03/12 Python
Python读取Excel数据并生成图表过程解析
2020/06/18 Python
英国最大的宠物食品和宠物用品网上零售商: Zooplus
2016/08/01 全球购物
Araks官网:纽约内衣品牌
2020/10/15 全球购物
夫妻婚内购房协议书
2014/10/05 职场文书
市场营销计划书范文
2015/01/16 职场文书
体育活动总结
2015/02/04 职场文书
人工作失职检讨书
2015/05/05 职场文书
捐款仪式主持词
2015/07/04 职场文书
2015年初中教务处工作总结
2015/07/21 职场文书
教师学期述职自我鉴定
2019/08/16 职场文书
解决go在函数退出后子协程的退出问题
2021/04/30 Golang
Linux中如何安装并部署Redis
2022/04/18 Servers