jquery怎么实现奇偶行不同颜色
程序员文章站
2022-03-17 16:28:51
...
在jquery中，可以使用“$(":odd")”和“$(":even")”选择器分别选中奇行和偶行的元素，然后使用css()方法分别给奇行和偶行元素设置不同的颜色样式即可实现奇偶行不同颜色。
本教程操作环境：windows7系统、jquery1.7.2版本，Dell G3电脑。
推荐教程：jquery视频教程
jquery奇偶行不同颜色的示例
<!DOCTYPE html>
<html>
<head>
<title>Insert a title</title>
<meta charset="utf-8">
<script src="demo/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#Table tr:odd").css("background-color", "#e6e6fa");
$("#Table tr:even").css("background-color", "#fff0fa");
});
</script>
</head>
<body>
<table id="Table">
<tr>
<td>第一行</td>
</tr>
<tr>
<td>第二行</td>
</tr>
<tr>
<td>第三行</td>
</tr>
<tr>
<td>第四行</td>
</tr>
</table>
</body>
</html>
效果图：
说明：
jQuery :odd 选择器可以选取每个带有奇数 index 值的元素（比如 1、3、5）。
jQuery :even 选择器可以选取每个带有偶数 index 值的元素（比如 2、4、6）。
其中，index 值从 0 开始，所有第一个元素是偶数 (0)。
更多编程相关知识，请访问：编程教学！！
以上就是jquery怎么实现奇偶行不同颜色的详细内容，更多请关注其它相关文章！