JS小功能(列表頁面隔行變色)簡單實現(xiàn)
更新時間：2013年11月28日 14:59:18 作者：
這篇文章主要介紹了JS列表頁面隔行變色簡單實現(xiàn)，有需要的朋友可以參考一下
效果：
代碼：
復(fù)制代碼 代碼如下:
<head runat="server">
<title></title>
<script type="text/javascript">
window.onload = function () {
var otab = document.getElementById('tab1');
var thiscolor = '';
for (var i = 0; i < otab.tBodies[0].rows.length; i++) {
otab.tBodies[0].rows[i].onmouseover = function () {
thiscolor = this.style.background;
this.style.background = '#00FFFF';
};
otab.tBodies[0].rows[i].onmouseout = function () {
this.style.background = thiscolor;
};
if (i % 2) {
otab.tBodies[0].rows[i].style.background = '';
}
else {
otab.tBodies[0].rows[i].style.background = '#FFFF00';
}
}
};
</script>
</head>
<body>
<table id="tab1" border="1" style="text-align: center; width: 500px; margin: 200px auto">
<thead>
<tr style="background-color: #FF0000">
<td>
種族名稱
</td>
<td>
種族簡稱
</td>
<td>
英雄
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
人類聯(lián)盟
</td>
<td>
HUM
</td>
<td>
代表性英雄：AM
</td>
</tr>
<tr>
<td>
獸人部落
</td>
<td>
ORC
</td>
<td>
代表性英雄：BM
</td>
</tr>
<tr>
<td>
不死亡靈
</td>
<td>
UD
</td>
<td>
代表性英雄：DK
</td>
</tr>
<tr>
<td>
暗夜精靈
</td>
<td>
NE
</td>
<td>
代表性英雄：DH
</td>
</tr>
</tbody>
</table>
</body>
相關(guān)文章
這篇文章主要介紹了Javascript刷新頁面的實例的相關(guān)資料,希望通過本文能幫助到大家，需要的朋友可以參考下2017-09-09
JavaScript實現(xiàn)打印星型金字塔功能實例分析
這篇文章主要介紹了JavaScript實現(xiàn)打印星型金字塔功能,結(jié)合具體實例形式分析了javascript針對輸出任意給定行數(shù)星型金字塔圖形的原理與相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2017-09-09
js在客戶端驗證密碼強度，兼容FireFox和IE...2007-05-05
self中resend是調(diào)用“基類方法”的原語，它會把當前接收到的消息原樣發(fā)送給其原型（parent*）。在ECMA-v5時代，我們終于可以做出這個偉大的東西了。2010-07-07
統(tǒng)一接口：為FireFox添加IE的方法和屬性的js代碼
統(tǒng)一接口：為FireFox添加IE的方法和屬性的js代碼...2007-03-03
這篇文章主要介紹了JS+CSS3實現(xiàn)的類似于蘋果iwatch計時器特效，很實用的代碼，推薦給大家，有需要的小伙伴可以參考下。2015-08-08
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)拖動模態(tài)框，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
如今ES6已經(jīng)發(fā)布了有一段時間了，很多人學(xué)了ES6但是卻沒運行環(huán)境，下面這篇文章主要給大家介紹了關(guān)于搭建ES6運行環(huán)境的相關(guān)資料，文中介紹的非常詳細，對大家具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起看看吧。2017-07-07
prototype與jquery下Ajax實現(xiàn)的差別
Ajax技術(shù)在web中應(yīng)用的相當廣泛,最近項目需要用到Ajax，由于主站所用的是Jquey，而某個欄目的開發(fā)用的是prototype，這樣一來就必須對JS代碼做調(diào)整了。2009-09-09
這篇文章主要介紹了深入淺析JavaScript函數(shù)前面的加號和嘆號的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-07-07