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