Removing all child nodes from an element May03 '07
Feedback
# (2 of 11): Rjarl » rjarl.com
1 month after the fact. (Fri 08 Jun 2007, 6:20 AM CST)
I "LOVE" You bro!. Thank you very much, nice funcion.
# (3 of 11): Brad Kemper
1 month after the fact. (Fri 08 Jun 2007, 8:09 PM CST)
Very nice indeed. Once you have your node (in this case "cell"), you can actually right the rest as one line:
if (cell.hasChildNodes()) while (cell.childNodes.length >= 1) cell.removeChild(cell.firstChild);
# (4 of 11): Bob
2 months, 1 week after the fact. (Sat 14 Jul 2007, 11:21 AM CST)
You can actually cut it down even more
while(cell.hasChildNodes()) cell.removeChild(cell.firstChild);
very useful to know this though
# (5 of 11): Carlos
5 months, 1 week after the fact. (Mon 08 Oct 2007, 8:03 PM CST)
Thanks much. If you want to remove all but the first child (or first n children), you can use:
if (cell.hasChildNodes()) while (cell.childNodes.length > n) cell.removeChild(cell.childNodes[cell.childNodes.length-1]);
# (6 of 11): Gublooo
7 months after the fact. (Sun 02 Dec 2007, 10:18 PM CST)
Awesome - you rock man :) - now i can sleep instead of trying to figure out a way to make this thing work and staying up all night.....thanks a lot bro
# (7 of 11): Viji
7 months, 3 weeks after the fact. (Thu 27 Dec 2007, 6:17 AM CST)
Thank you. I have referred many site.at last i have found solution with your source code
# (9 of 11): Devin
12 months after the fact. (Mon 28 Apr 2008, 11:32 PM CST)
This might be better:
var cell = document.getElementById("cell");
while ( cell.hasChildNodes() )
{
cell.removeChild( cell.firstChild );
}
# (10 of 11): Jock Meston
1 year, 1 month after the fact. (Thu 05 Jun 2008, 8:07 AM CST)
instead of:
if ( cell.hasChildNodes() )
{
while ( cell.childNodes.length >= 1 )
{
cell.removeChild( cell.firstChild );
}
}
wouldn't
while ( cell.hasChildNodes() )
{
cell.removeChild( cell.firstChild );
}
do it more succinctly?
# (11 of 11): Darby Magill
1 year, 1 month after the fact. (Fri 13 Jun 2008, 10:46 PM CST)
rewrote - more generic.
Hey there... thanks for getting me on the right path for what I was looking for. I changed it up a bit and thought I'd share it back with you.
I wanted to delete only certain children, not all. so refering to firstchild didn't work for me. Also I added a parameter of name of object for which you want to delete the children. Finally, I only am removing those that have a name (not undefined). Oh I'm throwing in my alertObject function because I use it in the other one.
function removeChildren(s){ var bDebug=true; var o = document.getElementById(s); var oi; var i; if (o){ if (bDebug==true) {alert('got o');} if ( o.hasChildNodes() ) { if (bDebug==true) {alert('has' +o.childNodes.length + ' children');} if (o.childNodes.length >= 1 ) { for (i=0;i<=o.childNodes.length;i=i+1) { oi = o.childNodes[i]; if (oi.name != undefined) { if (bDebug==true) {alertObject('removing: ' +oi.name);} // o.removeChild(oi); } } } } } }
function alertObject(o){
var sLength="";
if (o.length != undefined){
if (typeof o == 'string'){
sLength = "
Number of elements: 1";
}
else{
sLength = "
Number of elements:" + o.length;
}
}
var sMsg = "Object name: " + o.name;
sMsg = sMsg + "
Type: " + typeof o;
sMsg = sMsg + "
Type: " + o.type;
sMsg = sMsg + "
id: " + o.id;
sMsg = sMsg + sLength;
alert (sMsg);
}
To the person who mentioned succinct code... that's cool but I'd rather have code that is more readable and maintanable by others. Personal preferrence.
~Darby
RSS feed for comments on this post
Leave feedback
It's often useful to remove all child nodes from a specific element, with JavaScript.
You are at the feedback permalink page for: Removing all child nodes from an element
# (1 of 11): Jay » prall.net
1 week, 3 days after the fact. (Sun 13 May 2007, 1:33 PM CST)
thanks. Just what I wanted. I used the technique in a clearElements(x) function.