js控制表單奇偶行樣式的簡單方法
更新時間：2013年07月31日 10:45:04 作者：
這篇文章介紹了js控制表單奇偶行樣式的簡單方法，有需呀偶的朋友可以參考一下
一、如果使用JQuery的話可以直接JQuery的
$("tr:odd").addClass("clazzName");
$("tr:even").addClass("clazzName");
二、如果是使用純js的話
1.先獲取table標(biāo)簽，var table = document.getElementById()
2.再獲取里面的tbody標(biāo)簽var tbody = table.getElementsByTagName("tbody")[0]
3.再獲取tr標(biāo)簽var trs = tbody.getElementsByTagName("tr")
4.然后迭代trs
for(var i=0; i
if(i%2==0){
trs[i].style.backgroundColor="red";
}else{
trs[i].style.backgroundColor="blue";
}
}
獲取tbody標(biāo)簽是必須的，雖然你沒寫，但是瀏覽器在編譯table的時候會自動給加上
所有的tr標(biāo)簽都是在tbody里面的
復(fù)制代碼 代碼如下:
$("tr:odd").addClass("clazzName");
$("tr:even").addClass("clazzName");
二、如果是使用純js的話
1.先獲取table標(biāo)簽，var table = document.getElementById()
2.再獲取里面的tbody標(biāo)簽var tbody = table.getElementsByTagName("tbody")[0]
3.再獲取tr標(biāo)簽var trs = tbody.getElementsByTagName("tr")
4.然后迭代trs
復(fù)制代碼 代碼如下:
for(var i=0; i
if(i%2==0){
trs[i].style.backgroundColor="red";
}else{
trs[i].style.backgroundColor="blue";
}
}
獲取tbody標(biāo)簽是必須的，雖然你沒寫，但是瀏覽器在編譯table的時候會自動給加上
所有的tr標(biāo)簽都是在tbody里面的
相關(guān)文章
微信小程序引入外部icon(阿里巴巴矢量圖標(biāo))的全過程
在小程序中,有默認的圖標(biāo)icon組件,但你會發(fā)現(xiàn)它的圖標(biāo)樣式很少,可能很多時候并不能滿足我們的需求,所以這篇文章主要給大家介紹了關(guān)于微信小程序引入外部icon(阿里巴巴矢量圖標(biāo))的相關(guān)資料,需要的朋友可以參考下2022-09-09
下面小編就為大家?guī)硪黄コ址笥覂蛇叺目崭?實現(xiàn)代碼)。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考2016-05-05
JavaScript裝箱及拆箱boxing及unBoxing用法解析
這篇文章主要介紹了JavaScript裝箱及拆箱boxing及unBoxing用法解析,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-06-06
UniApp中Scroll-View設(shè)置占滿下方剩余高度的方法記錄
在使用uniapp開發(fā)項目過程中有時候會想讓一些組件占有屏幕剩余的高度,下面這篇文章主要給大家介紹了關(guān)于UniApp中Scroll-View設(shè)置占滿下方剩余高度的方法,需要的朋友可以參考下2023-04-04
這篇文章主要介紹了jquery實現(xiàn)簡單的遮罩層相關(guān)代碼，內(nèi)容很豐富，教大家實現(xiàn)遮罩層效果，感興趣的小伙伴們可以參考一下2016-01-01
js 執(zhí)行上下文和作用域的相關(guān)總結(jié)
這篇文章主要介紹了js 執(zhí)行上下文和作用域的相關(guān)知識總結(jié)，幫助大家更好的理解和使用JavaScript，感興趣的朋友可以了解下2021-02-02
這篇文章主要介紹了深入理解JavaScript內(nèi)存管理和GC算法，下面文章主要講解JavaScript的垃圾回收機制以及常用的垃圾回收算法；還講解了V8引擎中的內(nèi)存管理，最后介紹了Performance工具如何使用2022-07-07
javascript判斷ie瀏覽器6/7版本加載不同樣式表的實現(xiàn)代碼
ie6/ie7的兼容問題很讓人苦惱，我們可以針對這兩個版本的瀏覽器單獨寫?yīng)毩⒌臉邮奖?，來解決兼容問題。這里的例子以判斷ie6與ie7來加載不同的樣式表2011-12-12
原生js實現(xiàn)倒計時功能（多種格式調(diào)用）
本文主要介紹了原生js實現(xiàn)倒計時（多種格式調(diào)用）的方法，具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
這篇文章主要介紹了小程序new Date()方法失效問題解決,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-07-07