使用js实现table表格隔行变色
发布在:网站学习 评论: 8 条评论

使用js实现table表格隔行变色

发表于:2019-02-26 11:12:36      发布在:网站学习      评论:8 条评论

一、效果

1





2





3





4





二、js代码

<script>
    window.onload=function() {
                      var tbl = document.getElementById("id"); // 先获取table id
                     var rows = tbl.getElementsByTagName("tr"); // 获取里面的行tr
                     for(i=0;i<rows.length;i++) {  // 遍历里面的行
                                 var j = parseInt(i/1); // 以每1行为单位
                            if(j%2==0){ // 再通过取模来设置每隔1行显示不同的两种颜色
                                  rows[i].style.backgroundColor="rgb(255, 255, 255)";
                                   }else{
                                       rows[i].style.backgroundColor="#0f0";
                                 }
                        }
               };
</script>
评论
你好,访客
今天在这里签到啦,又学了一些建站知识! 时间:下午10:24:10
评论时间:2019-03-02 22:24:26 回复
大佬哦!這些東西我真學不來。。。
评论时间:2019-02-28 20:34:06 回复
好神奇,点进来是蓝色和灰色相间,发完评论又变了。。。
评论时间:2019-02-27 21:04:30 回复
@Lvtu:直接把js写作文章里面上的 是这样!!
评论时间:2019-02-27 23:32:12 回复
今天在这里签到啦,又学了一些建站知识!
评论时间:2019-02-27 21:03:02 回复
以前用过php,用的是类似的方法隔行显示不同的颜色!
评论时间:2019-02-27 18:39:41 回复
简单实用,
评论时间:2019-02-27 08:01:42 回复
简洁实用,好文章!
评论时间:2019-02-26 15:54:59 回复