利用HTML和JS制作隔行换背景颜色的表格
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制作隔行换背景颜色的表格的更多相关文章
- 利用css+原生js制作简易钟表
利用css+原生js制作简单的钟表.效果如下所示 实现该效果,分三大块:html.javascript.css html部分html部分比较简单,定义一个clock的div,内部有原点.时分秒针.日期 ...
- jquery点击tr换背景颜色
jquery点击tr换tr的背景颜色,table的id为db-list1jQuery(function() { jQuery("#db-list1 tr").click( func ...
- js之隔行换色
HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...
- css和js处理隔行换色的问题
<html> <head> <meta charset="utf-8"> <meta name="" conten ...
- EasyUI中DataGrid隔行改变背景颜色。
<table id="dg" class="easyui-datagrid" style="width: 1000px; height: 300 ...
- OpenCV实现彩色图像轮廓 换背景颜色
转摘请注明:https://i.cnblogs.com/EditPosts.aspx?opt=1 有时候我们需要不一样颜色的证件照,下面就用OpenCV来实现证件照的蓝底.红底等换颜色: 代码如下: ...
- js和jquery修改背景颜色的区别
html: <HTML> <head> <meta http-equiv="content-type" content="text/html ...
- js修改隔行tr的颜色。
<!DOCTYPE html><html lang="zh-Hans"><head> <meta charset="UTF-8& ...
- JS练习:定时器--背景颜色交替变换
代码: <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UT ...
随机推荐
- Java实现FTP文件上传与下载
实现FTP文件上传与下载可以通过以下两种种方式实现(不知道还有没有其他方式),分别为:1.通过JDK自带的API实现:2.通过Apache提供的API是实现. 第一种方式 package com.cl ...
- js不能执行的几个小白错误
1.如果使用jquery,而没有将js代码写在$(function(){}):里边,没等dom全部加载完,在执行时出现错误 2.如果感觉都写对了却没有执行,那么可能是在想要执行的函数前有一加载就能执行 ...
- Geronimo应用服务器和MySQL数据库服务器
就是Web 2.0的全部,尽管该术语出现才几乎一年的时间,但现在好像只有烹饪杂志还没有加入到讨论Web 2.0未来出路的行列中.自从出现了里程碑式的文章"What Is Web 2.0:De ...
- [转]Multiple outputs from T4 made easy
本文转自:http://damieng.com/blog/2009/01/22/multiple-outputs-from-t4-made-easy One of the things I wante ...
- HDU 4825 Xor Sum(经典01字典树+贪心)
Xor Sum Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 132768/132768 K (Java/Others) Total ...
- [英语学习]国外的在线广播网站,类似喜马拉雅和荔枝FM
今天在Seattle Art Museum 网站上看东西,发现了这个好网站. 主要是外文资料,可以练听力,也可以找到<我爱吕西安>的英文版本. https://soundcloud.co ...
- django 1.8 日志配置
django 1.8 日志配置 以下为setings配置logging代码片段 BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(_ ...
- VR制作的规格分析
因为UE4的演示资源更丰富一些,我这边把UE4的有代表性的演示都跑了一遍,同时也通过Rift确认效果,和里面的资源制作方式. 首先,UE4是基于物理渲染的引擎,大部分都是偏向图像真实的.使用的材质 ...
- Ubuntu中搭建Nginx+PHP环境最简单的方法
先安装: sudo apt-get install nginx php5-fpm 然后编辑配置文件: sudo gedit /etc/nginx/site-available/default 找到lo ...
- laravel 查看SQL语句
Route::get('/test-sql', function(){ DB::enableQueryLog(); $user = App\User::first(); return DB::getQ ...