表格奇偶行設(shè)置不同顏色的核心JS代碼
更新時間：2013年12月24日 15:33:39 作者：
表格奇偶行設(shè)置不同顏色，在某些情況下還是比較實用的，下面有個不錯的示例，大家可以參考下，希望對大家有所幫助
這是一個比較實用的功能，設(shè)置奇偶行顏色不同后閱讀表格數(shù)據(jù)的體驗明顯變好，否則數(shù)據(jù)會顯得非常繁雜擁擠（當表格數(shù)據(jù)行多時體驗尤為明顯）。只有當你自己真正做這方面的東西接觸到時才有強烈的體會，反正我是剛剛經(jīng)歷了，留在這里備參考吧~
核心JS腳本代碼如下（table元素的id根據(jù)自己的情況調(diào)整，代碼中的jquery-1.7.min.js可以到j(luò)query的官網(wǎng)上下載）
<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>
核心JS腳本代碼如下（table元素的id根據(jù)自己的情況調(diào)整，代碼中的jquery-1.7.min.js可以到j(luò)query的官網(wǎng)上下載）
復(fù)制代碼 代碼如下:
<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>
相關(guān)文章
超級有用的13個基于jQuery的內(nèi)容滾動插件和教程
這篇文章與大家分享13個超級有用的 jQuery 內(nèi)容滾動插件和教程。您可能經(jīng)常能看到一些網(wǎng)站上特色區(qū)域的內(nèi)容以滾動方式變化，這是一種在有限的網(wǎng)頁空間內(nèi)展示更多內(nèi)容的良好方式，而且能吸引用戶注意力。2011-07-07
jQuery lazyLoad圖片延遲加載插件的優(yōu)化改造方法分享
jQuery lazyLoad.js插件 是一款基于jquery框架，可以“實現(xiàn)”圖片延遲加載的插件2013-08-08
一步一步學(xué)jquery UI 1.72 之datepicker，中間都寫了注釋方便大家學(xué)習(xí)。
2009-12-12 
本篇文章主要是對jquery獲取dom固定元素 添加樣式的簡單實例進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2014-02-02 
validate是一個基于Jquery的表單驗證插件，利用他的remote可以用來自定義遠程驗證，這篇文章主要介紹了JQuery validate插件Remote用法大全的相關(guān)資料,需要的朋友可以參考下
2016-05-05 
這篇文章主要介紹了基于JQuery實現(xiàn)頁面定時彈出廣告,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
2020-05-05 
超好用的jQuery分頁插件jpaginate用法示例【附源碼下載】
這篇文章主要介紹了超好用的jQuery分頁插件jpaginate用法,結(jié)合實例形式簡單分析了jQuery分頁插件jpaginate的基本調(diào)用方式、參數(shù)屬性及配置方法,并附帶源碼供讀者下載,需要的朋友可以參考下
2018-12-12 
capacityFixed 基于jquery的類似于新浪微博新消息提示的定位框
公司項目需求中有一個類似于新浪微博新消息提示的定位框的效果，需要的朋友可以參考下。
2011-05-05