使用javascript实现隔行变色

转载 2012年03月29日 19:39:34
<!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>
    <title>使用JavaScript实现隔行变色</title>
    <style type="text/css">
           body{font-size:12px;text-align:center}
           #tbStu{width:260px;border:solid 1px #666;background-color:#eee}
           #tbStu tr{line-height:23px}
           #tbStu tr th{background-color:#ccc;color:#fff}
           #tbStu .trOdd{background-color:#fff}
    </style>
    <script type="text/javascript">
         window.onload=function(){
         var oTb=document.getElementById("tbStu");
         for(var i=0;i<oTb.rows.length-1;i++){
             if(i%2){
             oTb.rows[i].className="trOdd";
             }
           }
         }
    </script>
</head>
<body>
<table id="tbStu" cellpadding="0" cellspacing="0">
  <tbody>
    <tr>
      <th>学号</th><th>姓名</th><th>性别</th><th>总分</th>
    </tr>
    <!--奇数行-->
    <tr>
      <td>1001</td><td>张小明</td><td>男</td><td>320</td>
    </tr>
    <!--偶数行-->
    <tr>
      <td>1002</td><td>李明琪</td><td>女</td><td>350</td>
    </tr>
    <!--...-->
  </tbody>
</table>
</body>
</html>

Write Your Own Operating System Tutorial(2)

Lesson 2: Making Our First Bootable DiskIn this lesson, we will learn how to create a boot program o...
  • tangl_99
  • tangl_99
  • 2003-01-20 09:50:00
  • 1667

用JavaScript实现表格隔行变色

  不变色    xxxxxxxx   xxxxxxxx   xxxxxxxx   xxxxxxxx    不变色 var TbRow = document.getElementById("goale...
  • xyjnzy
  • xyjnzy
  • 2006-06-24 13:27:00
  • 1193

利用Javascript实现隔行变色

new document .back{ background:#005aa0; } /** * 隔行变色 */ function change()...
  • java_zhaoyanli
  • java_zhaoyanli
  • 2016-03-01 23:49:30
  • 1246

JavaScript之使特定的表格隔行变色

思路 1.依据表格id获取表格   使用方法 getElementById("元素id") 2.表格里获取元素  使用方法 getElementsByTagName("元素') 该方法返回的是标签名...
  • u012493556
  • u012493556
  • 2015-07-28 08:30:48
  • 575

JavaScript —— 1、删除 + 2、实现表格隔行换色以及鼠标悬停换色

var index = 1;//每一行的索引号 function addData(){ debugger; var _name = document.getElementById("id1")....
  • Alifangxin
  • Alifangxin
  • 2018-01-02 20:59:06
  • 47

javascript 隔行变色,九九乘法表

//隔行变色 /*var tab1=document.getElementById('tab1'); //判断表格是否是空 if(tab1!=null){ 循环计算长度 for(var i=...
  • qq_35285268
  • qq_35285268
  • 2016-09-01 09:12:50
  • 162

用JQuery实现表格隔行换颜色

最近在学习Jquery,其实很多论坛中都有一个特点就是每张贴都是隔行换颜色的,相信这点大家可能发现。那么怎样实现这种功能呢。方法有3种:     方法一:使用CSS样式,定义两个类的样式,分别使用到...
  • suntanyong88
  • suntanyong88
  • 2011-09-20 13:30:54
  • 11393

用js或Jquery实现table隔行变色以…

//js实现隔行变色 window.onload=function(){ var otal=document.getElementByIdx_x_x("otable"); for(var i=0; i...
  • lsfhack
  • lsfhack
  • 2017-04-08 08:33:55
  • 527

教你一天玩转JavaScript(六)——使用JavaScript完成后台数据展示表格的隔行换色

在后台展示数据的页面上,通常需要使用表格标签来进行数据的展示,那些没有背景的表格是比较难看的,但我们可以使用JavaScript来控制表格的隔行换色。效果类似如下: 要想使用JavaScript...
  • yerenyuan_pku
  • yerenyuan_pku
  • 2017-05-05 22:46:35
  • 1043

隔行变色表格

  • 2013年10月05日 21:20
  • 3KB
  • 下载
收藏助手
不良信息举报
您举报文章:使用javascript实现隔行变色
举报原因:
原因补充:

(最多只允许输入30个字)