比較簡單的,例如:有一區域<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等,我們都會碰到這樣的問題,有時會因為這樣的問題而浪費很多的時間。很早就已經知道了這個問題,不過總是太相信自己的記憶,而沒有好好記錄,現在特記錄下來,警示自己,同時也與大家分享。