作者chph (愁痕飘絮)
看板Web_Design
标题Re: [问题] 表格隔行背景色
时间Tue Apr 29 14:15:15 2008
CSS:
<style type="text/css">
tr.even td { background-color: #ddd;} /*偶数列样式*/
</style>
Javascript:
<script type="text/javascript">
/* <![CDATA[ */
// [事件] 网页载入完成
window.onload = function(){
// 抓tbody
var tbody = document.getElementsByTagName('tbody')[0];
// 抓 tbody 底下的 tr
var trs = tbody.getElementsByTagName('tr');
var isEven = true;
// 走访所有 tr
for ( var i = 0; i < trs.length; ++i ) {
isEven = ! isEven;
trs[i].className = (isEven) ? 'even' : '';
}
}
/* ]]> */
</script>
HTML 结构示意:
<table>
<thead>
<tr>
<th>
<tbody>
<tr>
<td>
--------
如果你把 script 放到网页底部，也就是 </body> 的前面，可以不用绑 onload 事件。
如果觉得 document.XXX 太长，可以找任何一套开源的 js lib 来用，
例如 jQuery/YUI/Prototype ...
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 210.71.11.70
※ 编辑: chph 来自: 210.71.11.70 (04/29 14:24)