快捷導(dǎo)航

JavaScript 存在陷阱刪除某一區(qū)域所有節(jié)點(diǎn)

更新時(shí)間：2010年05月10日 18:48:33 作者：

實(shí)現(xiàn)功能:刪除某一區(qū)域中所有節(jié)點(diǎn)。

比較簡(jiǎn)單的，例如：有一區(qū)域<div id="newbody" ></div>，現(xiàn)要求刪除其中所有節(jié)點(diǎn)。相信很多人會(huì)這樣寫(xiě)：

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

咋一看，是啊，對(duì)啊，這樣很正確啊，一個(gè)一個(gè)遍歷，最后全部刪除。但是，仔細(xì)想想，每當(dāng)刪除一個(gè)節(jié)點(diǎn)后，controlinfo.length就會(huì)變小，這樣下去是不能全部刪除的——存在Bug。那么該如何改進(jìn)呢？已經(jīng)很清楚了，既然從開(kāi)頭Start不行，那我們就從結(jié)尾Start，完全正確，如下：

復(fù)制代碼代碼如下:

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

調(diào)試，Very Good！

這種陷阱不只是在JavaScript中才會(huì)碰到，基本上所有的語(yǔ)言，如C#、Java等，我們都會(huì)碰到這樣的問(wèn)題，有時(shí)會(huì)因?yàn)檫@樣的問(wèn)題而浪費(fèi)很多的時(shí)間。很早就已經(jīng)知道了這個(gè)問(wèn)題，不過(guò)總是太相信自己的記憶，而沒(méi)有好好記錄，現(xiàn)在特記錄下來(lái)，警示自己，同時(shí)也與大家分享。

您可能感興趣的文章:

相關(guān)文章

JavaScript編碼小技巧分享
這篇文章適合任何一位基于JavaScript開(kāi)發(fā)的開(kāi)發(fā)者。我寫(xiě)這篇文章主要涉及JavaScript中一些簡(jiǎn)寫(xiě)的代碼，幫助大家更好理解一些JavaScript的基礎(chǔ)。希望這些代碼能從不同的角度幫助你更好的理解JavaScript。
2020-09-09
javascript按指定格式輸出文件最后更新時(shí)間
javascript按指定格式輸出文件最后更新時(shí)間...
2007-08-08
TypeScript 安裝使用及基本數(shù)據(jù)類型
這篇文章主要介紹了TypeScript 安裝使用及基本數(shù)據(jù)類型,本文分步驟給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2021-03-03
javascript + jquery實(shí)現(xiàn)定時(shí)修改文章標(biāo)題
用javascript+jquery寫(xiě)的一個(gè)定時(shí)器，定時(shí)修改文章標(biāo)題,需要的朋友可以參考下
2014-03-03
原生js+canvas實(shí)現(xiàn)驗(yàn)證碼
這篇文章主要為大家詳細(xì)介紹了原生js+canvas實(shí)現(xiàn)驗(yàn)證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-11-11
Bootstrap每天必學(xué)之按鈕（Button）插件
Bootstrap每天必學(xué)之按鈕（Button）插件,通過(guò)按鈕（Button）插件，您可以添加進(jìn)一些交互，比如控制按鈕狀態(tài)，或者為其他組件（如工具欄）創(chuàng)建按鈕組，感興趣的小伙伴們可以參考一下
2016-04-04
微信小程序 websocket 實(shí)現(xiàn)SpringMVC+Spring+Mybatis
這篇文章主要介紹了微信小程序websocket實(shí)現(xiàn)SpringMVC+Spring+Mybatis的相關(guān)資料,這里提供實(shí)現(xiàn)思路及實(shí)現(xiàn)代碼，需要的朋友可以參考下
2017-08-08
Javascript根據(jù)指定下標(biāo)或?qū)ο髣h除數(shù)組元素
刪除數(shù)組元素在工作中經(jīng)常會(huì)用到，本文講解一下Javascript根據(jù)下標(biāo)刪除數(shù)組元素的方法，需要了解的朋友可以參考下
2012-12-12
uniapp開(kāi)發(fā)H5打包微信小程序樣式失效的完美解決方法
本文主要介紹了在使用uniapp開(kāi)發(fā)H5頁(yè)面并打包成微信小程序時(shí),可能會(huì)出現(xiàn)樣式失效的問(wèn)題,并提供了解決方法,通過(guò)本文的學(xué)習(xí),讀者可以了解uniapp開(kāi)發(fā)H5頁(yè)面打包成微信小程序的注意事項(xiàng),避免出現(xiàn)樣式失效等問(wèn)題
2023-03-03
仿豆瓣分頁(yè)原型(Javascript版)
仿豆瓣分頁(yè)原型(Javascript版)...
2007-04-04