title: Accessing HTML DOM elements from javascript using `.childNodes`
body: <p>I'm wondering about the <code>.childNodes</code> property, I have the code below, and for some reason I get 18 children, while 6 are <code>HTMLInputElement</code>s as expected, and the rest are <code>undefined</code>. What is this about? Is there an efficient way to iterate over the <code>input</code> elements?</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;script&gt;
      window.onload = function(e){
          form = document.getElementById('myForm');
          alert(form.childNodes.length);
          for(i=0; i&lt;form.childNodes.length; i++){
              alert(form[i]);
          }
      }
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
  &lt;form id='myForm' action="haha" method="post"&gt;
  Name: &lt;input type="text" id="fnameAdd" name="name" /&gt;&lt;br /&gt;
  Phone1: &lt;input type="text" id="phone1Add" name="phone1" /&gt;&lt;br /&gt;
  Phone2: &lt;input type="text" id="phone2Add" name="phone2" /&gt;&lt;br /&gt;
  E-Mail: &lt;input type="text" id="emailAdd" name="email" /&gt;&lt;br /&gt;
  Address: &lt;input type="text" id="addressAdd" name="address" /&gt;&lt;br /&gt;
  &lt;input type="submit" value="Save" /&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>