Js_CSS实现多色表格

最新推荐文章于 2020-04-01 10:45:55 发布

yelb_ianylb

最新推荐文章于 2020-04-01 10:45:55 发布

阅读量151

点赞数

分类专栏： JavaScript 文章标签： CSS J# HTML

JavaScript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style rel="stylesheet" type="text/css">
.bg1 {
BACKGROUND: plum 0% 50%
}
.bg2 {
BACKGROUND: thistle 0% 50%
}
.bg3 {
BACKGROUND: aquamarine 0% 50%
}
</style>

<script>
//指定各行css样式
function changeRowCss(){
var table = document.getElementById("testRowsColor");
var rowclass=table.getAttribute("rowclass");
if(rowclass){
var bgCssArr=rowclass.split(",");//背景色的Css名称数组
if(bgCssArr.length>0){
rows = table.rows;
for (var j=0; j<rows.length; j++) {
var sn=j % (bgCssArr.length);
rows[j].className=bgCssArr[sn];
}
}
}
}
</script>
</HEAD>

<BODY>
<table id="testRowsColor" rowclass=",bg1,bg2,bg3" width="200px" >
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>
<tr>呵呵</tr>

</table>
</BODY>
<script>changeRowCss();</script>
</HTML>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

yelb_ianylb

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Js_CSS实现多色表格

New Document .bg1 { BACKGROUND: plum 0% 50%}.bg2 { BACKGROUND: thistle 0% 50%}.bg3 { BACKGROUND: aquamarine 0% 50%}//指定各行css样式 function changeRowCss(){ var table...
复制链接

扫一扫