For Loop with an Array

[DazzlingD]

I am having trouble with a for loop and printing out an array. Here is the function:

1 function showmenu(SectionName) {
2 TabName = SectionName + "Tab";
3 TabContainer = document.getElementById('ProductTabs');
4 TabArray = TabContainer.getElementsByTagName('a');
5 NumInArray = TabArray.length;
6 for (i=0; i < NumInArray; i++) {
7 document.write(TabArray.id);
8 document.write(" i=" + i);
9 }
10 document.write("<br>done");
11 }


When I run this on the page, it pulls 3 elements in to the Array (which is correct). I declare NumInArray because if I just use TabArray.length in the for loop, it will only cycle once regardless of whether line 7 is in or not. The output that I get from this function is

PhotosTab i=0


However, if I leave line 7 out, I get

i=0 i=1 i=2
done


Any idea why line 7 kills the script?

 

[vicvirk]

what does your html look like (i.e. the elements you are trying to grab)

--------
GOOGLE is a great resource to find answers to questions like "how do i..."

If you don't know exaclty what you want to do or what to search on, try Google Suggest:

http://www.google.com/webhp?complete=1&hl=en

--------
I have recently been semi-converted to ensuring all my code (well most of it) works in both javascript and non-javasc

 

[BillyRayPreachersSon]

If you are calling the function after the page has loaded I'd expect it to only run once, as, after the first document.write() call, all page content will be deleted.

So, are you running the function after the page has loaded or before? If the former, you'll need to remove your reliance on document.write and use other methods instead.

Perhaps also defining 'i' to be a local variable would be a good idea, in case you have another function that also uses a global variable called 'i' at the same time? You can do this by inserting the 'var' keyword:

for (var i=0; i<...

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[DazzlingD]

Thank you Dan.... the response.write was my actual problem and I apologize for not posting an entire example, including html here as I did on another forum where I got the answer, basically the same as yours. The html part of the page that was needed is

<div id="ProductTabs"> 
   <table width="300" border="3" cellspacing="0"> 
   <tr> 
      <td align="center" class="chosentab"><a id="PhotosTab" href="javascript:void(null)" onclick="showmenu('Photos')">Photos</a></td> 
      <td align="center" class="nonchosentab"><a id="CardsTab" href="javascript:void(null)" onclick="showmenu('Cards')">Cards & More</td> 
      <td align="center" class="nonchosentab"><a id="MerchandiseTab" href="javascript:void(null)" onclick="showmenu('Merchandise')">Merchandise</td> 
   </tr> 
   </table> 
</div>

I wanted to post the other response I got here because I always try to include my end "fix" on any forum posts because it's so annoying to find posts for your poblems and there not be an answer. I did not try this code because I figured out that I had fixed what I needed.

What I was actually trying to do was change a classname of an item, but when that wasn't working, I changed my commands to the document.write so that I could see what it was doing and what the different variables contained. I got most of the bugs worked out of it that way, but never tried going back to what I was actually wanting to have done. When the other forum poster said "Document.write is a crude tool", I figured that I may have fixed my problems without realizing it and so I went back and changed the document.write lines back to what I wanted, and it does work.

FYI for anyone reading or having a problem, here's the code that I ended up using:

   function showmenu(SectionName, DefaultMenu) {
      TabName = SectionName + "Tab";
      TabContainer = document.getElementById('ProductTabs');
      TabArray = TabContainer.getElementsByTagName('td');
      NumInArray = TabArray.length;
      for (i=0; i < NumInArray; i++) {
         if (TabName == TabArray[i].id) {
            TabArray[i].className = "chosentab";
         }
         else {
            TabArray[i].className = "nonchosentab";
         }
      }
  }

And here is the post from the other forum including the code that was suggeted to use to do what I was actually doing before - writing an array to the screen. (as I said, I have not tried this code myself)

Document.write is a crude tool, in this case overwriting existing javavasript.
change

for (i=0; i < NumInArray; i++) { 
document.write(TabArray[i].id); 
document.write(" i=" + i); 
} 
document.write("<br>done"); 
}

to

var S = ""; 
for (var i=0; i < NumInArray; i++) { 
S += TabArray[i].id + " i=" + i + "<br>done"; 
} 
documment.getElementById("menu").innerHTML = S;

in HTML where menu is required add

<div id="menu"></div>