這是一個比較實用的功能,設置奇偶行顏色不同後閱讀表格數據的體驗明顯變好,否則數據會顯得非常繁雜擁擠(當表格數據行多時體驗尤為明顯)。只有當你自己真正做這方面的東西接觸到時才有強烈的體會,反正我是剛剛經歷了,留在這裡備參考吧~
核心JS腳本代碼如下(table元素的id根據自己的情況調整,代碼中的jquery-1.7.min.js可以到jquery的官網上下載)
. 代碼如下:
<script src="jquery-1.7.min.js"></script>
<script>
$(document).ready(function(){
SetTableRowColor();
});
//用CSS控制奇偶行的顏色
function SetTableRowColor()
{
$("#Table tr:odd").css("background-color", "#e6e6fa");
$("#Table tr:even").css("background-color", "#fff0fa");
}
</scirpt>