1、源代码如下:

<!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>
<script type="text/javascript">
 function xlh(){
  var tbl = document.getElementById("tbl");
  var rows = tbl.rows.length;
  for(var i=0;i<rows;i++){
   if(i%2 == 0){
      tbl.rows[i].style.backgroundColor = "#cccccc";
   }
 }
}
</script>
</head>

<body onload="xlh()" bgcolor=antiquewhite>
 <h1 align="center">黄石港区民主党派成员登记表</h1>
    <table id="tbl" cellpadding="10" cellspacing="0" border="1" align="center">
     <tr>
         <td>党派名称</td>
            <td>姓名</td>
            <td>性别</td>
            <td>出生年月</td>
            <td>籍贯</td>
            <td>名族</td>
            <td>加入党派时间</td>
            <td>文化程度</td>
            <td>所在工作单位及职务</td>
            <td>社会职务</td>
            <td>联系电话</td>
            <td>所属社区</td>
            <td>所属网络</td>
            <td>操作</td>
        </tr>

<tr>
         <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td><a href="#">修改</a> <a href="#">删除</a></td>
        </tr>
        <tr>
         <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td><a href="#">修改</a> <a href="#">删除</a></td>
        </tr><tr>
         <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td><a href="#">修改</a> <a href="#">删除</a></td>
        </tr>
    </table>
</body>
</html>

2、运行效果如下:

利用HTML和JS制作隔行换背景颜色的表格的更多相关文章

  1. 利用css+原生js制作简易钟表

    利用css+原生js制作简单的钟表.效果如下所示 实现该效果,分三大块:html.javascript.css html部分html部分比较简单,定义一个clock的div,内部有原点.时分秒针.日期 ...

  2. jquery点击tr换背景颜色

    jquery点击tr换tr的背景颜色,table的id为db-list1jQuery(function() { jQuery("#db-list1 tr").click( func ...

  3. js之隔行换色

    HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  4. css和js处理隔行换色的问题

      <html> <head> <meta charset="utf-8"> <meta name="" conten ...

  5. EasyUI中DataGrid隔行改变背景颜色。

    <table id="dg" class="easyui-datagrid" style="width: 1000px; height: 300 ...

  6. OpenCV实现彩色图像轮廓 换背景颜色

    转摘请注明:https://i.cnblogs.com/EditPosts.aspx?opt=1 有时候我们需要不一样颜色的证件照,下面就用OpenCV来实现证件照的蓝底.红底等换颜色: 代码如下: ...

  7. js和jquery修改背景颜色的区别

    html: <HTML> <head> <meta http-equiv="content-type" content="text/html ...

  8. js修改隔行tr的颜色。

    <!DOCTYPE html><html lang="zh-Hans"><head> <meta charset="UTF-8& ...

  9. JS练习:定时器--背景颜色交替变换

    代码: <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UT ...

随机推荐

  1. 一些比较实用的javascript方法收集,留着有用

    动态加载javascript文件 <script type="text/javascript"> //<!-- /*动态加载方法*/ function loadS ...

  2. [BZOJ 2631]tree

    裸LCT..QAQ写了三遍没写对 真是老了..QAQ 主要错的地方是 init: size[i] = sum[i] = val[i] = mul[i] = 1; pushdown: 注意判断左右儿子是 ...

  3. hiho 毁灭者问题

    描述 在 Warcraft III 之冰封王座中,毁灭者是不死族打三本后期时的一个魔法飞行单位. 毁灭者的核心技能之一,叫做魔法吸收(Absorb Mana): 现在让我们来考虑下面的问题: 假设你拥 ...

  4. [转] - C++程序启动过程

    先说编译.链接过程1.预编译展开宏2.为每一个.cxx源文件编译一个目标文件3.编译器合成这些目标文件成一个库文件,同时解析可以找到的符号引用4.连接器把目标的库文件和所需要的引用的静.动态链接库进行 ...

  5. 关于isset使用产生Can't use function return value in write context错误

    在使用isset检测session的一个取值是否存在时,产生了这个问题 翻译一下:不能在填写的内容中使用函数的返回值.然后我查看了php手册看isset函数的使用:isset()只能用于变量,因为传递 ...

  6. CVE-2014-4113 windows通杀本地提权0day

    这个0day的发现挺有意思的,是老外CrowdStrike 发现的,被老外监测程序发现显示从WEBSHELL使用Win64.exe来提升权限. 原文地址:http://blog.crowdstrike ...

  7. 初学者对Spring MVC的认识

    首先是要一定说明的是,这倒是说明是什么?对吧Spring MVC 是SpringFrameWork的后续产品,并且已经融入到Spring Web Flow中同时Spring MVC 分离了控制器,模型 ...

  8. HDU 1166敌兵布阵+NOJv2 1025: Hkhv love spent money(线段树单点更新区间查询)

    敌兵布阵 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Submi ...

  9. twistd 启动Python服务

    twistd 启动Python服务 shell 脚本如下: #! /usr/bin/env sh MAIN_MODULE=pdf_task.py ROOT="/var/www/pdf/&qu ...

  10. python twisted启动定时服务

    以下是python脚本send_mms.py #############################################!/usr/bin/python# -*- coding: ut ...