JS控制表格隔行變色
更新時(shí)間：2006年06月26日 00:00:00 作者：
<table width="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>不變色</td>
</tr>
<tbody id="goaler">
<tr>
<td>xxxxxxxx</td>
</tr>
<tr>
<td>xxxxxxxx</td>
</tr>
<tr>
<td>xxxxxxxx</td>
</tr>
<tr>
<td>xxxxxxxx</td>
</tr>
</tbody>
<tr>
<td>不變色</td>
</tr>
</table>
<script language="JavaScript">
<!--
var TbRow = document.getElementById("goaler");
if (TbRow != null)
{
for (var i=0;i<TbRow.rows.length ;i++ )
{
if (TbRow.rows[i].rowIndex%2==1)
{
TbRow.rows[i].style.backgroundColor="";
}
else
{
TbRow.rows[i].style.backgroundColor="#F1F1F1";
}
}
}
//-->
</script>
<tr>
<td>不變色</td>
</tr>
<tbody id="goaler">
<tr>
<td>xxxxxxxx</td>
</tr>
<tr>
<td>xxxxxxxx</td>
</tr>
<tr>
<td>xxxxxxxx</td>
</tr>
<tr>
<td>xxxxxxxx</td>
</tr>
</tbody>
<tr>
<td>不變色</td>
</tr>
</table>
<script language="JavaScript">
<!--
var TbRow = document.getElementById("goaler");
if (TbRow != null)
{
for (var i=0;i<TbRow.rows.length ;i++ )
{
if (TbRow.rows[i].rowIndex%2==1)
{
TbRow.rows[i].style.backgroundColor="";
}
else
{
TbRow.rows[i].style.backgroundColor="#F1F1F1";
}
}
}
//-->
</script>
您可能感興趣的文章:
- javascript實(shí)現(xiàn)table表格隔行變色的方法
- js實(shí)現(xiàn)鼠標(biāo)經(jīng)過(guò)表格行變色的方法
- 原生JS操作網(wǎng)頁(yè)給p元素添加onclick事件及表格隔行變色
- 一個(gè)簡(jiǎn)單但常用的javascript表格樣式_鼠標(biāo)劃過(guò)行變色 簡(jiǎn)潔實(shí)現(xiàn)
- javascript基于jQuery的表格懸停變色/恢復(fù),表格點(diǎn)擊變色/恢復(fù),點(diǎn)擊行選Checkbox
- 高效的表格行背景隔行變色及選定高亮的JS代碼
- 用JS控制表格的逐行變色的表單
- javascript表格隔行變色加鼠標(biāo)移入移出及點(diǎn)擊效果的方法
- js兼容標(biāo)準(zhǔn)的表格變色效果
- JS實(shí)現(xiàn)表格隔行變色
相關(guān)文章
JS前端中的設(shè)計(jì)模式和使用場(chǎng)景示例詳解
這篇文章主要為大家介紹了JS前端中的設(shè)計(jì)模式和使用場(chǎng)景示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
這篇文章主要為大家介紹了JS前端使用canvas編寫(xiě)一個(gè)簽名板實(shí)現(xiàn)示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
一文了解JavaScript用Element?Traversal新屬性遍歷子元素
這篇文章主要介紹了一文了解JavaScript用Element?Traversal新屬性遍歷子元素，文章圍繞Element?Traversal新屬性的相關(guān)資料展開(kāi)詳細(xì)內(nèi)容,需要的朋友可以參考一下，希望對(duì)大家有所幫助2021-11-11
JS 4個(gè)超級(jí)實(shí)用的小技巧 提升開(kāi)發(fā)效率
JS有很多小技巧可以使代碼更精簡(jiǎn)、更簡(jiǎn)單。今天主要分享4個(gè)技巧，在平時(shí)的工作中可以大大的縮短代碼量和開(kāi)發(fā)時(shí)間。,需要的朋友可以參考下面文章內(nèi)容喲2021-09-09
微信小程序手勢(shì)操作之單觸摸點(diǎn)與多觸摸點(diǎn)
這篇文章主要介紹了微信小程序手勢(shì)操作之單觸摸點(diǎn)與多觸摸點(diǎn)的相關(guān)資料,需要的朋友可以參考下2017-03-03
微信小程序 location API接口詳解及實(shí)例代碼
這篇文章主要介紹了微信小程序 location API接口相關(guān)資料,這里詳細(xì)介紹了location API接口并附簡(jiǎn)單實(shí)例代碼，需要的朋友可以參考下2016-10-10
這篇文章主要介紹了利用JS創(chuàng)建一個(gè)錄屏功能，創(chuàng)建這個(gè)功能錢(qián)我們首先創(chuàng)建一個(gè)HTML文件，包含記錄按鈕和一個(gè)播放標(biāo)簽，下面來(lái)看看創(chuàng)建的詳細(xì)過(guò)程2021-11-11
微信小程序 生命周期和頁(yè)面的生命周期詳細(xì)介紹
這篇文章主要介紹了微信小程序 生命周期和頁(yè)面的生命周期詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2017-01-01
這篇文章主要為大家介紹了閉包結(jié)合遞歸等于柯里化的原理解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
JS繼承與工廠構(gòu)造及原型設(shè)計(jì)模式詳解
這篇文章主要為大家介紹了JS繼承與工廠構(gòu)造及原型設(shè)計(jì)模式詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07