编程 Javascript

jquery 双色表格实现代码

Posted in Javascript onDecember 08, 2009

https://3water.com/article/21027.htm
不多说了，直接给代码
代码

<html> 
<head> 
<title>双色表格</title> 
<style type="text/css"> 
<!-- 
table { 
border:solid 1px black; 
text-align:center; 
border-spacing:0px; 
} 
th,td { 
border:solid 1px black; 
width:100px; 
} 
--> 
</style> 
<script src="lib/jquery.js" type="text/javascript"></script> 
<script type="text/javascript" > 
$().ready(function() { 
$('tr:has(th)').css('background','violet'); //表格标题 
$('tr:even:gt(0)').css('background','yellow'); //偶数行,且行数大于0(即标题) 
$('tr:odd').css('background','olive'); //奇数行 
}); 
</script> 
</head> 
<body> 
<center> 
<table> 
<tr id="th"> 
<th>姓名</th> 
<th>科目</th> 
<th>成绩</th> 
</tr> 
<tr> 
<td>张三</td> 
<td>语文</td> 
<td>90</td> 
</tr> 
<tr> 
<td>张三</td> 
<td>数学</td> 
<td>87</td> 
</tr> 
<tr> 
<td>李四</td> 
<td>数学</td> 
<td>68</td> 
</tr> 
<tr> 
<td>王五</td> 
<td>英语</td> 
<td>76</td> 
</tr> 
</table> 
</center> 
</body> 
</html>

jquery 双色表格实现代码

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

巧妙破除网页右键禁用的十大绝招

Aug 12 Javascript

javascript 全等号运算符使用说明

May 31 Javascript

jQuery EasyUI API 中文文档 - ProgressBar 进度条

Sep 29 Javascript

浅析js中2个等号与3个等号的区别

Aug 06 Javascript

jQuery实现的动态伸缩导航菜单实例

May 07 Javascript

JQuery中上下文选择器实现方法

May 18 Javascript

Bootstrap按钮下拉菜单组件详解

May 10 Javascript

微信小程序 wx.request合法域名配置详解

Nov 23 Javascript

bootstrap-table.js扩展分页工具栏(增加跳转到xx页)功能

Dec 28 Javascript

深入了解js原型模式

May 30 Javascript

解决小程序无法触发SESSION问题

Feb 03 Javascript

jQuery实现电梯导航模块

Dec 22 jQuery

IE浏览器打印的页眉页脚设置解决方法

Dec 08 #Javascript

JQuery 表单中textarea字数限制实现代码

Dec 07 #Javascript

测试JavaScript字符串处理性能的代码

Dec 07 #Javascript

javascript 混合的构造函数和原型方式，动态原型方式

Dec 07 #Javascript

JavaScript 常见对象类创建代码与优缺点分析

Dec 07 #Javascript

javascript prototype原型操作笔记

Dec 07 #Javascript

javascript Array.sort() 跨浏览器下需要考虑的问题

Dec 07 #Javascript