利用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 ...
随机推荐
- JAVA7遍历文件夹
在JAVA7中提供了新的遍历文件的方法,比原有File类的递归遍历效率要好大约30%左右. 测试结果: 测试用的File类的递归,是经过对比测试几种方法,找出相对效率较好的来和JAVA7进行测试. 1 ...
- 关于inf的问题
详见实例 #include<algorithm> #include<iostream> #include<cstring> #include<cstdio&g ...
- ubuntu中的Wine详解
什么是wine?(转自百度百科,具体看百科) wine,是一款优秀的Linux系统平台下的模拟器软件,用来将Windows系统下的软件在Linux系统下稳定运行,该软件更新频繁,日臻完善,可以运行许多 ...
- v.size() return size_t not int 返回无符号整型数
In the C++ STL, the vector size() function return size_t, which is unsigned int, not int. So imagine ...
- html标签,格式控制标签,内容容器标签,超链接标签,图片标签,表格
打开DREAMWEAVER,新建HTML,如下图: body的属性: bgcolor 页面背景色 background 背景壁纸.图片 text 文字颜色 topmargin 上边距 leftm ...
- php5全版本绕过open_basedir读文件脚本
这是前段时间写的代码了(http://www.weibo.com/1074745063/ByAPqj7s0),最近一直忙着和几个同学一起做非安全类的创业项目.所以也没拿到JAE.SAE测试一下. 不说 ...
- NodeJs - 序列化
https://nodejs.org/dist/latest-v5.x/docs/api/querystring.html 序列化: querystring.stringify({name:'Lee' ...
- php 的curl 模拟登陆
做一个类似这样的web 应用. 1,解决掉验证码 其实这是正方的一个小bug,当我们进入登陆界面时,浏览器会去请求服务器,服务器会生成一个验证码图片.如果我们不去请求这个图片,那么正方后台也不会生成相 ...
- Linux邮件服务器架构
// 上面的过程只是实现了简单的本地用户的文件发送功能,只需要安装mailutil,不需要安装配置sendmail,看鸟哥的Linux私房菜中写的应该是本地用户发送邮件不需要sendmail.只有当非 ...
- X-Japan
听X Japan这么久,几位大叔还是没有认清,真是惭愧. X-Japan是日本著名的视觉系摇滚乐队.原来叫X,在1992年8月HEATH入团的同时改名为X JAPAN. 乐队成立于1982年1月,19 ...