JavaScript removeNode() method

Some times programmer may needs to remove some node according to their requirements while using JavaScript.

JavaScript removeNode() method


Some times programmer may needs to remove some node according to their requirements while using JavaScript. There is a method removeNode() provided in JavaScript for removing nodes accordingly by getting its element's reference.

We can use removeNode() method to delete specified node from the given element's hierarchy. It returns a reference to the node object removed. Following is the syntax of removeNode() method:

Syntax :

 element_object.removeNode( childFlag );

where element_object is the element's reference to apply method on it and parameter passed to the method childFlag is a boolean value and indicates that whether method is to remove itself only (i.e without its children) or with its children. If this value is true, it means method have to remove its child elements also and if false, it means that it doesn't need to remove child elements.

Description of Code :

In the following example we have created four buttons named "Button1", "Button2", "Button3" and  "Button4". On these button's click event we have called four different functions which removes that button by using the method removeNode() on that specified element. Here is the full HTML code for removeNode() method's example :

 <script language="JavaScript">
   function removeButton1(){
    alert("Button 1 removed");
   function removeButton2(){
    alert("Button 2 removed");
   function removeButton3(){
    alert("Button 3 removed");
   function removeButton4(){
    alert("Button 4 removed");
<div style="background: #ff9900; width:'100%';" 
  <font color="#0000ff" size="12pt">
	<b>Remove Node Example</b>
    <div style="background: #0099ff; width:'100%';" align="center">
	<p>Button 1 <input id="btn1" type="button" value="Button1" 
               onClick="removeButton1()" /></p>                     
	<p>Button 2 <input id="btn2" type="button" value="Button2" 
               onClick="removeButton2()" /></p>
	<p>Button 3 <input id="btn3" type="button" value="Button3" 
               onClick="removeButton3()" /></p>
	<p>Button 4 <input id="btn4" type="button" value="Button4" 
               onClick="removeButton4()" /></p>

Output :

Removed Button 1

Removed Button 2

Removed Button 4

You can also download the full source code by the following link :

Download Source Code


Share on Google+Share on Google+

JavaScript removeNode() method

Posted on: February 7, 2009 If you enjoyed this post then why not add us on Google+? Add us to your Circles



Discuss: JavaScript removeNode() method   View All Comments

Post your Comment

Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
Jeremy Harris
December 11, 2011
Is not valid code

Doesn't work outside of IE. Use document.getElementById('x').parentNode.removeChild(document.getElementById('x')); Or elem.parentNode.removeChild(elem);