课
程
程
资
讯
讯
综
合
合
javascript:JQ实现双色表格
上次用javascript实现了上色表格，见JS实现双色表格。但通过jQuery强大的
选择器可更加简洁，优雅的实现。
不多说了，直接给代码
代码
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
td90/td
/tr
tr
td张三/td
td数学/td
td87/td
/tr
tr
td李四/td
td数学/td
td68/td
/tr
tr
td王五/td
td英语/td
td76/td
/tr
/table
/center
/body
/html
:
| 广告合作：400-664-0084 全国热线：400-664-0084 Copyright 2010 - 2017 www.my8848.com 珠峰网 粤ICP备15066211号 珠峰网 版权所有 All Rights Reserved 
|
