removeChild()

@KorNov 05.2009 — #There are several basic concepts which you need to understand in javascript.

First at all: the reference. Before trying to modify the status of an element, you need to refer it, a way or another. In javascript there are several methods to refer an element: by id, by name, by tagname, by the absolute or relative position in the DOM tree. In your case, probably the easier way to refer that paragraph element is by its tagname: It is the first <p><p/>element

<i>
 </i>var myElement=document.getElementsByTagName('p')[0];

Second: you must learn the javascript methods. For instance: removeChild(): the syntax is:

<i>
 </i>[I]theParentNode[/I].removeChild([I]theNode[/I])

where [I]theNode[/I] and [I]theParentNode[/I] should be the references of the element and its parent node.

Third. In javascript the statements are nested in functions, functions are fired by events which follows the user's action. Now: which could be the event in your case?

Anyway, here's a basic example:

<i>
 </i>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
 &lt;html&gt;
 &lt;head&gt;
 &lt;title&gt;untitled&lt;/title&gt;
 &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
 &lt;meta http-equiv="Content-Style-Type" content="text/css"&gt;
 &lt;meta http-equiv="Content-Script-Type" content="text/javascript"&gt;
 &lt;script type="text/javascript"&gt;
 function removeEl(tag,n){
 if(!document.getElementsByTagName(tag)[n]){return}//catch the error in case there is no element
 var el=document.getElementsByTagName(tag)[n];
 el.parentNode.removeChild(el);
 }
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 &lt;p&gt;text&lt;/p&gt;
 &lt;p&gt;other text&lt;/p&gt;
 &lt;br&gt;
 &lt;br&gt;
 &lt;span onclick="removeEl('p',0)"&gt;Remove the first paragraph&lt;/span&gt;
 &lt;/body&gt;
 &lt;/html&gt;

@uknowmeimauthorNov 05.2009 — #Thank you for braking this down for me. Im just starting javascript and it is to say the least stretching me...however i have another ignorant question to ask...

in your code [B]function removeEl(tag,n){[/B] was does the 'n' respresent? could it have been done without it?

@KorNov 06.2009 — #The [B]n[/B], in my code, is the passed argument of the [I]index[/I]. Since getElementsByTagName(tag) returns a [I]collection[/I] of elements, not a single element the index is necessary to specify [I]which[/I] element is to me removed.

removeChild()

3 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

removeChild()

3 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

3 Comments(s) _↴

Also in #JavaScript _↴