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随机漂浮广告代码具体实例
Nov 19 Javascript
如何判断Javascript对象是否存在的简单实例
May 18 Javascript
js实现图片淡入淡出切换简易效果
Aug 22 Javascript
微信小程序  生命周期详解
Oct 27 Javascript
Angular 4依赖注入学习教程之简介(一)
Jun 04 Javascript
详解使用React全家桶搭建一个后台管理系统
Nov 04 Javascript
在 Angular-cli 中使用 simple-mock 实现前端开发 API Mock 接口数据模拟功能的方法
Nov 28 Javascript
详解webpack引入第三方库的方式以及注意事项
Jan 15 Javascript
elementUI table表格动态合并的示例代码
May 15 Javascript
ajax跨域访问遇到的问题及解决方案
May 23 Javascript
微信小程序环境下将文件上传到OSS的方法步骤
May 31 Javascript
vue使用transition组件动画效果的实例代码
Jan 28 Vue.js
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
php中magic_quotes_gpc对unserialize的影响分析
2014/12/16 PHP
PHP图像处理类库MagickWand用法实例分析
2015/05/21 PHP
PHP在线调试执行的实现方法(附demo源码)
2016/04/28 PHP
详解yii2使用多个数据库的案例
2017/06/16 PHP
PHP+redis实现微博的拉模型案例详解
2019/07/10 PHP
php ActiveMQ的安装与使用方法图文教程
2020/02/23 PHP
Using the TextRange Object
2006/10/14 Javascript
JavaScript-世界上误解最深的语言分析
2007/08/12 Javascript
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
2009/12/07 Javascript
jquery 使用点滴函数代码
2011/05/20 Javascript
JavaScript中window.open用法实例详解
2015/04/15 Javascript
js和jquery分别验证单选框、复选框、下拉框
2015/12/17 Javascript
Bootstrap自动适应PC、平板、手机的Bootstrap栅格系统
2016/05/27 Javascript
js判断手机号是否正确并返回的实现代码
2017/01/17 Javascript
详解Angular2中Input和Output用法及示例
2017/05/21 Javascript
详解如何在React组件“外”使用父组件的Props
2018/01/12 Javascript
微信小程序使用swiper组件实现类3D轮播图
2018/08/29 Javascript
在小程序Canvas中使用measureText的方法示例
2018/10/19 Javascript
微信小程序之几种常见的弹框提示信息实现详解
2019/07/11 Javascript
jquery选择器和属性对象的操作实例分析
2020/01/10 jQuery
js+canvas实现转盘效果(两个版本)
2020/09/13 Javascript
在Python的Django框架中包装视图函数
2015/07/20 Python
Python简单的制作图片验证码实例
2017/05/31 Python
Python使用matplotlib绘制多个图形单独显示的方法示例
2018/03/14 Python
PyTorch学习笔记之回归实战
2018/05/28 Python
Python concurrent.futures模块使用实例
2019/12/24 Python
Python基础之字典常见操作经典实例详解
2020/02/26 Python
英国一家集合了众多有才华设计师品牌的奢侈店:Wolf & Badger
2018/04/18 全球购物
UNIX文件系统分类
2014/11/11 面试题
小学生田径运动会广播稿
2014/09/11 职场文书
国家税务局干部作风整顿整改措施
2014/09/18 职场文书
求职自我推荐信
2015/03/24 职场文书
党员转正介绍人意见
2015/06/03 职场文书
2015中学教师个人工作总结
2015/07/22 职场文书
《妈妈别哭,有我在》读后感3篇
2020/01/13 职场文书
仅用一句SQL更新整张表的涨跌幅、涨跌率的解决方案
2021/05/06 MySQL