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 JavaScript and the DOM (Retiring) Getting a Handle on the DOM Practice Selecting Elements

Cameron Cochran
seal-mask
.a{fill-rule:evenodd;}techdegree
Cameron Cochran
Front End Web Development Techdegree Student 8,781 Points
Posted by Cameron Cochran
.a{fill-rule:evenodd;}techdegree
Cameron Cochran
Front End Web Development Techdegree Student 8,781 Points

Task 1 of 3 has me stumped from 'Javascript and the Dom' has me stumped. Anybody have some insight here?

I've tried a few different ways to do this with no luck.

js/app.js 
let navigationLinks document.querySelectorAll('nav ul li a');
let galleryLinks;
let footerImages;
index.html 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/responsive.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>
  <body>
    <header>
      <a href="index.html" id="logo">
        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html" class="selected">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <div id="wrapper">
      <section>
        <ul id="gallery">
          <li>
            <a href="img/numbers-01.jpg">
              <img src="img/numbers-01.jpg" alt="">
              <p>Experimentation with color and texture.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-02.jpg">
              <img src="img/numbers-02.jpg" alt="">
              <p>Playing with blending modes in Photoshop.</p>
            </a>
          </li>
        </ul>
      </section>
      <footer>
        <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>
        <a href="http://facebook.com/nickpettit"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
        <p>&copy; 2016 Nick Pettit.</p>
      </footer>
    </div>
  <script src="js/app.js"></script>
  </body>
</html>

3 Answers

Steven Parker
Steven Parker
231,275 Points
Steven Parker
Steven Parker
231,275 Points

You are missing the assignment operator ("=") between the variable name and the method call.

Also, you can optionally simplify your selector to name only the outer container and target elements ("nav a", literally "links inside the <nav> element").

Steven Parker
Steven Parker
231,275 Points
Steven Parker
Steven Parker
231,275 Points

Cameron Cochran — Glad to help. You can mark the question solved by choosing a "best answer".
And happy coding!

Marcin Michalik
Marcin Michalik
6,505 Points
Marcin Michalik
Marcin Michalik
6,505 Points

Can you use in this case also selectElementsByTagName instead of querrySelectorAll?

Steven Parker
Steven Parker
231,275 Points
Steven Parker
Steven Parker
231,275 Points

Not by itself. The "selectElementsByTagName" function takes just a name and not a selector, so there's no opportunity to filter based on the "nav" container.

Marcin Michalik
Marcin Michalik
6,505 Points

ok thanks, couldn't figure that our myself, I was first trying to use ByTagName but did not work so I have used querySelectorAll :)