ignoring hidden rows

How would I rewrite this function so that any hidden rows are completely ignored?

function stripeRows(table) {
    var numRows = table.rows.length;
    for (var i = 1; i < numRows; i++) {
        var ID = tab开发者_JS百科le.rows[i].id;
        if (i % 2 == 0) {
            table.rows[i].className = "GridRow";
        }
        else {
            table.rows[i].className = "GridRowAlt";
        }
    }
}

---

EDIT: turns out my suggestion to use CSS will not work - go figure... In any case you can use jQuery

$('tr:visible:odd').addClass('even');
$('tr:visible:even').addClass('odd');

(note the inversion, since jQuery counts from 0). No need to loop at all! :-)

See it working

---

However you detect hidden rows, you must at least decouple your counter from your row index, e.g. via for(... in ...). If you find a hidden row, continue your loop:

var i = 0;
for (var row in table.rows) {
    if(row.style.visibility == 'hidden') 
    // or similar (see other answers), e.g.: if($('#element_id:visible').length > 0) 
        continue;

    var ID = row.id;
    if (i % 2 == 0) {
        row.className = "GridRow";
    }
    else {
        row.className = "GridRowAlt";
    }
    ++i;
}