Alright Ladies and Gentleman, by now you should be pretty up to speed on the basics of Javascript. DOM is very popular when coding Javascript especially if you don’t have control over the base HTML coding.

In this tutorial we are going to talk about .parentNode

What is .parentNode and what does it mean?

.parentNode is just how it sounds when it comes to DOM on Javascript. When used properly it will go to the parent tag/node of whatever you are using.

here is an example:

<div class=”parent”>
<div id=”child”>blah</div>
</div>

lets look at that. We have a 2 div tags and one of them is inside the other. Lets say we want to call the class parent. Well with just using Javascript you need to call the tag “div” than loop through them and use an if statment that matches the class.

What if that class is used me than once on the page and I only want that one div?!

Great question!!

Well this is where DOM comes into play and using .parentNode you should first call by ID: document.getElementById(“child”);

so now that we have that we can just do document.getElementById(“child”).parentNode;

and bam! we just successfully called the specific div with the class parent without looping though the other divs and searching for that one div.

pretty simple huh? Look in the JSchool on how to use all these DOM tutorials in a script to move up and down the page with ease.