您的位置：首页 > 其它

table显示n条记录，每3行换一次颜色

2011-12-08 10:53 453 查看

有时候我们会遇到对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.onload=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行绿色，交替。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航