使用JQ完成表格的隔行换色
需求分析:
在我们的实际开发过程中,我们的表格如果所有的行都是一样的话,很容易看花眼,所以我们需要让我们的表格隔行换色
技术分析:
获取所有行 table.rows
遍历所有行
根据行号去修改每一行的背景颜色: bgColor
style.backgroundColor = “red”
步骤分析:
- 导入JQ的包
- 文档加载完成函数: 页面初始化
- 获得所有的行 : 元素选择器
- 根据行号去修改颜色
代码实现:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../js/jquery-1.11.0.js" ></script>
<!--
1. 导入JQ的包
2. 文档加载完成函数: 页面初始化
3. 获得所有的行 : 元素选择器
4. 根据行号奇数/偶数去修改颜色
-->
<script>
$(function(){
//获得所有的行 : 元素选择器
$("tbody > tr:even").css("background-color","#CCCCCC");
//修改奇数行
$("