Skip to content

Latest commit

 

History

History
66 lines (52 loc) · 2.51 KB

File metadata and controls

66 lines (52 loc) · 2.51 KB

jQuery & DOM Exercises

Nature Drawing 101: Draw a Tree! - solutions

  1. Draw the structure (DOM tree) of the following HTML document:
<!DOCTYPE html>
<html>
  <head>
    <title>My Site</title>
  </head>
  <body>
    <header>
      <ul>
        <li><a href="/">Home</a></li>
        <li><a href="/about">About</a></li>
        <li><a href="/contact">Contact</a></li>
      </ul>
    </header>

    <section>  
      <h1>Welcome to my site!</h1>
      <img src="/static/say_cheese.jpg">
      <p>Words and <a href="/">links</a></p>
    </section>

    <footer>
      <small>Copyright 2015 Jon Doe.</small>
    </footer>
  </body>
</html>
  • How many children does header have?
  • Name a direct child of the p element.
  • Name a direct parent of the p element
  • What is the parent of the html element?

CSS Selector Challenge - solutions

Please refer to this google doc.

For each page, come up with as many CSS Selectors as you can think of to select the html elments in red, and only the elements in red.

Exercise - Hack Github with jQuery!

Hack Github with jQuery Challenges - Solutions