gennemløb af tabel - skiftende farver
Hej Eksperter.Jeg bruger følgende javascript til at løbe en tabel igennem og farve den skiftende.
Desværre virker den kun på en tabel, er der nogen der kan lurer hvordan jeg får den til at løbe flere tabeller igennem og farve dem.
<script>
// this function is needed to work around
// a bug in IE related to element attributes
function hasClass(obj) {
var result = false;
if (obj.getAttributeNode("class") != null) {
result = obj.getAttributeNode("class").value;
}
return result;
}
function stripe(id) {
// the flag we'll use to keep track of
// whether the current row is odd or even
var even = false;
// if arguments are provided to specify the colours
// of the even & odd rows, then use the them;
// otherwise use the following defaults:
var evenColor = arguments[1] ? arguments[1] : "#fff";
var oddColor = arguments[2] ? arguments[2] : "#eee";
// obtain a reference to the desired table
// if no such table exists, abort
var table = document.getElementById(id);
if (! table) { return; }
// by definition, tables can have more than one tbody
// element, so we'll have to get the list of child
// <tbody>s
var tbodies = table.getElementsByTagName("tbody");
// and iterate through them...
for (var h = 0; h < tbodies.length; h++) {
// find all the <tr> elements...
var trs = tbodies[h].getElementsByTagName("tr");
// ... and iterate through them
for (var i = 0; i < trs.length; i++) {
// avoid rows that have a class attribute
// or backgroundColor style
if (! hasClass(trs[i]) &&
! trs[i].style.backgroundColor) {
// get all the cells in this row...
var tds = trs[i].getElementsByTagName("td");
// and iterate through them...
for (var j = 0; j < tds.length; j++) {
var mytd = tds[j];
// avoid cells that have a class attribute
// or backgroundColor style
if (! hasClass(mytd) &&
! mytd.style.backgroundColor) {
mytd.style.backgroundColor =
even ? evenColor : oddColor;
}
}
}
// flip from odd to even, or vice-versa
even = ! even;
}
}
}
</script>
kode:
<body onload="stripe('produkter', '#fff', '#F5F5F5');">
<table id="stripe">
<tr><td></td></tr>
<tr><td></td></tr>
</table>
ovenstående virker perfekt.
men hvis jeg har følgende kode:
<table id="stripe">
<tr><td></td></tr>
<tr><td></td></tr>
</table>
<table id="stripe">
<tr><td></td></tr>
<tr><td></td></tr>
</table>
- så løber den kun første tabel igennem :/
På forhånd tak.
