Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript One Solution

Posted by Patrick Kane
.a{fill-rule:evenodd;}techdegree
Patrick Kane
Full Stack JavaScript Techdegree Student 354 Points

parent of child

how we can recognise when it's a parent from a child. Is it in this case when the HTML tag inside <body> structure is in one line that means it's a sibling and when it's a little bit to the left it's a parent of the tag which is a little bit left not right underneath of the tag?

last two examples:

const wrapper = list.parentNode;
const body = wrapper.parentNode;

I assume that ul with the class="list" is a child of div with the class="wrapper" that would make sense if the sentence I explained above is true.

If not what about tags <div></div> and <h1>Color Palette:</h1> above.

Appreciate your answer

Hannah Cherba
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Hannah Cherba
Front End Web Development Techdegree Graduate 14,319 Points
Hannah Cherba
.a{fill-rule:evenodd;}techdegree seal-36
Hannah Cherba
Front End Web Development Techdegree Graduate 14,319 Points

First of all, classes can be added to anything in the HTML. They are something you add to differentiate between different elements in a file. Take the below code; indentation helps us to see the parent/child relationship. Hopefully this answers your question.

<!DOCTYPE html>
<html>
    <head>
        <title>My profile</title> //the parent of title would be the 'head'
    </head>
    <body> //within this body element there are the children: div, h1, h2, ul, and li
      <div></div> //h1, h2, and ul are children of this div
          <h1 class="title">Resume Page</h1>
          <h2>Summary</h2>
          <ul class="summary-list"> //the 'ul' is the parent element to the 'li'
              <li>Experience in JavaScript, HTML, and CSS</li>
              <li>An AA degree in Interdisciplinary Studies, 
                with a focus in the arts and humanities</li>
              <li>Five years of experience running a medical office</li>

        </ul>
    </body>
</html>

2 Answers

Steven Parker
Steven Parker
229,644 Points
Steven Parker
Steven Parker
229,644 Points

For HTML tags, a "parent" tag is one that encloses one or more other tags, and a "child" is a tag that is inside another tag. Based on this, the ul with the class "list" is indeed a child of the div with the class "wrapper". But the li is not the grandchild of the h1 since it is not inside the h1. The h1 in this example is not a parent of any elements. But the body is an ancestor (at some level) to all the visible elements.

Using indentation to show relationship is a recommended "best practice" but it is not required for proper operation and should not be relied on when working with code written by others. But as Guil's HTML code does use this convention, the the relationship is also reflected by the indentation; but only for those tags that are contained by or enclose other tags.

Steven Parker
Steven Parker
229,644 Points
Steven Parker
Steven Parker
229,644 Points

Hannah, in the video example (not the one you posted here), yes. The body element is the great-grandparent of the li and the parent of the div (with class "wrapper"). It is also the grandparent of the h1 and the ul.

Patrick Kane
seal-mask
.a{fill-rule:evenodd;}techdegree
Patrick Kane
Full Stack JavaScript Techdegree Student 354 Points
Patrick Kane
.a{fill-rule:evenodd;}techdegree
Patrick Kane
Full Stack JavaScript Techdegree Student 354 Points

Alright I think I got it. Lets make sure.

So li is children of ul, grandchildren of H1 and grand grandchildren of body