JavaScript实现隔行换颜色
Posted Jones_dd
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript实现隔行换颜色相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function() {
//获取表
var tb = document.getElementById("tableId");
//根据表获取表里的所有行，返回的是数组
var row1 = tb.getElementsByTagName("tr");
for (var i = 0; i < row1.length; i++) {
//var num = row1[i];
if (i % 2 == 0) {
row1[i].style.backgroundColor = "darkgray";
} else {
row1[i].style.backgroundColor = "dimgray";
}
}
}
</script>
</head>
<body>
<table width="600px" align="center" border="1px" id="tableId">
<tr>
<td align="center">
<font color="#996633" size="5">用户注册</font>
</td>
</tr>
<tr>
<td align="right">用户名</td>
<td><input type="text" name="userName" /></td>
</tr>
<tr>
<td align="right">密码</td>
<td><input type="password" name="userPassword" /></td>
</tr>
<tr>
<td align="right">确认密码</td>
<td><input type="password" name="rePassword" /></td>
</tr>
<tr>
<td align="right">性别</td>
<td><input type="radio" name="girl" checked="checked" value="女" />女
<input type="radio" name="girl" checked="checked" value="女" />男
</td>
</tr>
<tr>
<td align="right">出生日期</td>
<td align="left">
<input type="text" />
</td>
</tr>
<tr>
<td width="50%"></td>
<td align="left"><input type="submit" align="center" value="提交" /></td>
</tr>
</table>
</body>
</html>
以上是关于JavaScript实现隔行换颜色的主要内容，如果未能解决你的问题，请参考以下文章