Comments on: Removing HTML Element children with JavaScript

By: D3c1m4L

D3c1m4L — Tue, 23 Sep 2008 23:49:21 +0000

Hi,
I am currently tracking memory leak bugs in Internet Explorer for a product. I wanted to point out that using innerHTML=”" can cause memory leaks and removing children can cause memory leaks if any child elements have event handlers. Googling these terms should yield enough results to get you started. Beware of methods that do not take this into account.

By: Nick

Nick — Tue, 22 Jul 2008 15:20:48 +0000

I am doing this:

var removeChildren = function (node) {
while (node.hasChildNodes()) {
node.removeChild(node.firstChild);
}
};

and firefox keeps telling me:

node.hasChildNodes is not a function

By: Evan Bowling

Evan Bowling — Fri, 14 Mar 2008 17:34:14 +0000

I just thought you might want to know that I just got an error with the initial testing on the node variable in IE7 and Firefox, but it worked when I removed the following section:

if(node !== undefined && node !=== null) {
return;

By: Bimal

Bimal — Mon, 18 Feb 2008 09:33:26 +0000

DOM should work on all: IE, Firefox and Opera. I am using the one!

By: Arian

Arian — Fri, 02 Nov 2007 13:35:15 +0000

Just wondering, for this part …
if(node !== undefined && node !=== null)
…
Dont you want to return nothing if the values are null or undefined, so only proceed if have a valid node? aka
if(node == undefined && node == null)
return null;
//otherwise do while loop

Anyway in the orig code, ‘!===’ a javascript equality operator?
I know ‘!==’ is strict equality operator, is ‘!===’ a mistake? i guess doesnt matter if that line should be replaced.

By: jerrygarciuh

jerrygarciuh — Tue, 26 Jun 2007 13:09:05 +0000

Thanks! This was a big help!

By: emurhfkq

emurhfkq — Fri, 22 Jun 2007 02:41:16 +0000

people are stranger

By: Des Traynor

Des Traynor — Wed, 20 Dec 2006 16:11:07 +0000

Many thanks for this Mike, worked a treat.
Des

By: Andrew

Andrew — Mon, 23 Oct 2006 23:35:47 +0000

If you wanted to check what you are deleting you could use a for-in loop:

for(key in parentNode.childNodes){
if(parentNode.childNodes[key].nodeName == ‘IMG’){
parentNode.removeChild(parentNode.childNodes[key]);
}
}

By: Kari Chase

Kari Chase — Fri, 29 Sep 2006 14:50:26 +0000

I was successfully able to delete nodes with the removeChild/ while loop as you suggested.

However, in my case I am adding/removing tr elements as you expand/collapse a tree structure. In firefox it is working perfectly, in IE after items are removed there seems to be blank white space added in there place which pushes all rows below down and looks awkward. Any ideas why IE is doing this?
thanks