0

So, the title sums it up nicely. I'm banging my head on this one.
I understand that the null error would usually occur due to timing, as in i'm asking it to find something in the document before its loaded. However, earlier in my JS code, i am able to getElementsByTagName without issue. Also, the whole cascade of js functions begins with window.onload, so the document is ready, as near as i can tell.

Proof its in the .html file:

<section id="main">

     <header>
        <a href="#">Enter Site</a>
     </header>

     <nav class="links">
        <ul>
           <li><a href="#">Galleries</a></li>
           <li><a href="#">Video</a></li>
           <li><a href="#">Albums</a></li>
           <li><a href="#">Pricing</a></li>
           <li><a href="#">Testimonials</a></li>
           <li><a href="#">Wedding Planner</a></li>
           <li><a href="#">Shopping Cart</a></li>
        </ul>
     </nav>

     <address>
        New Accents Photography &#9830;
        14 Mountain View Road &#9830;
        Ashland, OR  97521 &#9830;
        (541) 555-6002 
     </address>

     <article>
       <p>New Accents is photography studio specializing in wedding 
          portraiture; serving the
          needs of Southern Oregon and Northern California.
       </p>
       <p>We'll capture your wedding in whatever fashion you wish:
          from romantic to zany and all the styles in between.
       </p>
     </article>

     <footer>
        <span class="left">New Accents Photography &copy; 2015 (US)</span>
        <span class="right">
           <a href="#">About</a>
           <a href="#">Terms</a>
           <a href="#">Help</a>
        </span>
     </footer>

  </section>

From the .js file:

function displayThumbs(){
var figBox = document.createElement("figure");
figBox.setAttribute("id", "thumbnails");
for(var i = 0; i < allSheets.length; i++)
{
    var sheetImg = document.createElement("img");
    var imgName = allSheets[i].title + "_small.png";
    sheetImg.setAttribute("src", imgName);
    sheetImg.title = allSheets[i].title;
    sheetImg.onclick = showSheet();
    figBox.appendChild(sheetImg);
}
var thisMain = document.getElementById("main");
thisMain.appendChild(figBox);
}
user3042535
  • 11
  • 1
  • 3
  • 1
    Move your script to the bottom of the page. – RobG Jun 16 '15 at 00:02
  • or into `onDocumentReady`. – Thilo Jun 16 '15 at 00:05
  • I've edited the question, because I don't believe I clearly stated that my JS functions are started with window.onload, which loads the first function, which loads the second, etc. In the previous function, I am able to retrieve elements by tag name without issue, so it makes no sense that "main" isn't available yet. – user3042535 Jun 16 '15 at 00:22
  • nevermind. Using 'defer' solved the issue, although it doesn't explain why I could access other element nodes, but not this one. – user3042535 Jun 16 '15 at 01:16

0 Answers0