Re: [問題] 表格隔行背景色
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)
討論串 (同標題文章)