网上css实现的方法很多,但是不能兼容所有浏览器,而且耗费浏览器内存。因此,这个方法被放弃,使用js方法,虽然不能全局批量操作,但是可以兼容所有浏览器。
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>无标题文档</title>
<style type=”text/css”>
.bf{ padding:0; margin:auto;}
.bf table{ text-align:center;line-height:14pt;}
.bf th{ width:50px; padding:10px;}
.f1{ background:#ffffff;}
.f2{ background:#eaeaea;}
.f3{ background:#f7f7f7;}
table { border-color:#989797;}
</style>
</head>
<body>
…..
表格代码省略
<script type=”text/javascript”>
var bg=document.getElementsByTagName(‘tr’);
for(var i=0,j=0;i<bg.length;i++)
{
if(bg[i].className!=’b')
{ j++;
bg[i].className=j%2==0?’f1′:’f2′;
}
else
{bg[i].className=’f3′}
}
</script>
</body>
</html>
原创文章,转载请注明: 转载自焦秋野 | 关注网站设计,前端资讯,用户体验,SEO,网站设计
本文链接地址: js控制表格背景颜色交替
博主这个办法不错
学习了 ·以后用得着