SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2007
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    running through every other row of a table

    Hello,

    I'm trying to create a function which hides (and another which unhides) every other row of a table.

    Below is my code, which refuses to work. I'm guessing I don't know enough about how childNodes works as alert(len) returns 33, when the table only has 8 rows in the <tbody>.

    Any pointers gratefully received

    Rhys

    Code:
    function HideAllScoringRows() {
                var tab = document.getElementById("breakdownTable");
                var tbody = tab.getElementsByTagName("tbody"); 
                tbody = tbody[0];
                var trows = tbody.childNodes;
                var row;     
                var len = trows.length;
                alert(len);
                var j;
                for (i = 0; (2*i + 1) < len; i++) {
                    j=2*i + 1;
                    row = trows[j];
                    row.style.display = 'none';
                }
           }

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2008
    Posts
    5,757
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code JavaScript:
    function HideAllScoringRows() {
        var tab = document.getElementById("breakdownTable");
        var tbody = tab.getElementsByTagName("tbody");
        var trows = tbody[0].rows;
        var len = trows.length;
        for (var i = 0; i < len; i++) {
            if (i % 2 == 0) { // even num
            //if (i % 2 == 1) { // odd num
                continue;
            }
            trows[i].style.display = 'none';
        }
    }

  3. #3
    SitePoint Evangelist
    Join Date
    Jul 2007
    Posts
    345
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Go up in twos.
    Code:
    for (var i = 0, l = trows.length; i < l; i += 2) {
      trows[i].style.display = 'none';
    }

  4. #4
    SitePoint Zealot Amenthes's Avatar
    Join Date
    Oct 2006
    Location
    Bucharest, Romania
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Following the spec, childNodes will return the new lines and spaces you used for making a readable source as text nodes. Like this:

    Code HTML4Strict:
    <p>
        <a href="#">link</a>
    </p>

    That paragraph has actually 3 child nodes:

    Code HTML4Strict:
    <p> <!-- here's a child node in the form of a new line
       plus the space before the link --><a href="#">link</a> <!-- the link is the second child node --> <!-- now comes the 3rd child in the form of a new line after the link -->
    </p>

    Anyway, what I said above does not apply to IE6 which does not count these new lines as child nodes, so... as far as I know, IE6 will return the number you expected.
    I'm under construction | http://igstan.ro/

  5. #5
    SitePoint Enthusiast
    Join Date
    Sep 2007
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I reckon that's almost certainly the problem

    Cheers for the help
    Rhys


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •