有时候 我们会遇到对table的行显示不同背景色的问题,对于每行换一次颜色和每两行和三行换一个颜色的处理方式都是类似的,下面就说一下每3行换一次颜色的方法。
<body>
<tableid="tbl">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
<tr><td>4</td></tr>
<tr><td>5</td></tr>
<tr><td>6</td></tr>
<tr><td>7</td></tr>
<tr><td>8</td></tr>
<tr><td>9</td></tr>
<tr><td>10</td></tr>
</table>
</body>
<scripttype="text/javascript">
window.οnlοad=function()
{
var tbl =document.getElementById("tbl");
rows =tbl.getElementsByTagName("tr");
for(i=0;i<rows.length;i++)
{
var j =parseInt(i/3);
if(j%2==0)rows[i].style.backgroundColor="#f00";
else rows[i].style.backgroundColor="#0f0";
}
}
</script>
这样显示的效果就是3行红色,3行绿色,交替。