快捷導(dǎo)航

Js 實現(xiàn)表格隔行換色一例

更新時間：2009年11月10日 21:51:28 作者：

Js實現(xiàn)表格隔行換色一例，這種效果網(wǎng)上已經(jīng)有很多啦，每一種都有特色，請大家選擇使用。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Js實現(xiàn)表格隔行換色一例</title> <style type="text/css"> body{ padding:0; margin:0; font:Arial; font-size:12px;} .bf{ padding:0; margin:auto;} .bf table{ text-align:center;line-height:14pt;} .bf th{ width:50px; padding:10px;} .f1{ background:#fff8f0;} .f2{ background:#f0f7ff;} .f3{ background:#f7f7f7;} </style> </head> <body> <div   id="wppm3vysvbp"   class="bf"> <table border="1" bordercolor="#00CCFF" cellspacing="0" > <caption>腳本之家歡迎你</caption> <tr class="b"> <th></th> <th scope="col">2006年</th> <th scope="col">2007年</th> <th scope="col">2008年</th> <th scope="col">2009年</th> </tr> <tr class="b"><th scope="row" rowspan="4">總</th></tr> <tr> <td>4</td> <td>2</td> <td>56</td> <td>43</td> </tr> <tr> <td>10</td> <td>4</td> <td>10</td> <td>10</td> </tr> <tr> <td>10</td> <td>76</td> <td>10</td> <td>9</td> </tr> <tr class="b"><th scope="row" rowspan="4">總</th></tr> <tr> <td>10</td> <td>10</td> <td>10</td> <td>10</td> </tr> <tr> <td>2</td> <td>10</td> <td>12</td> <td>10</td> </tr> <tr> <td>10</td> <td>10</td> <td>10</td> <td>10</td> </tr> <tr class="b"><th scope="row" rowspan="4">總</th></tr> <tr> <td>10</td> <td>5</td> <td>10</td> <td>10</td> </tr> <tr> <td>10</td> <td>7</td> <td>10</td> <td>3</td> </tr> <tr> <td>10</td> <td>5</td> <td>7</td> <td>8</td> </tr> </table> </div>  </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

您可能感興趣的文章:

相關(guān)文章

js操作二級聯(lián)動實現(xiàn)代碼
網(wǎng)上二級（多級）聯(lián)動的例子也不少，有各種不同的操作方法。我所采用的方法網(wǎng)上也應(yīng)該有的，不過我還沒有看到過。
2010-07-07
Javascript 異步加載詳解(瀏覽器在javascript的加載方式)
本文總結(jié)一下瀏覽器在 javascript 的加載方式,需要的朋友可以參考下
2012-05-05
僅在IE6/7/8下cssText返回值少了分號的測試代碼
在IE6/7/8中少了分號。使用cssText屬性時需注意。
2011-03-03
拖動時防止選中
本文主要介紹了拖動時防止選中的小知識點。具有很好的參考價值，下面跟著小編一起來看下吧
2017-02-02
使用JavaScrip模擬實現(xiàn)仿京東搜索框功能
使用js模擬實現(xiàn)京東的搜索框，主要用了js中的onfocus(注冊焦點事件)，onblur(失去焦點的事件)；本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友參考下吧
2019-10-10
JavaScript正則表達式實例詳解
在編寫處理字符串的程序或網(wǎng)頁時，經(jīng)常會有查找符合某些復(fù)雜規(guī)則的字符串的需要。正則表達式就是用于描述這些規(guī)則的工具。換句話說，正則表達式就是記錄文本規(guī)則的代碼。
2016-10-10
JavaScript高級程序設(shè)計閱讀筆記（十六） javascript檢測瀏覽器和操作系統(tǒng)-detect.js
javascript檢測瀏覽器和操作系統(tǒng) detect.js使用介紹，需要的朋友可以參考下
2012-08-08
javascript實現(xiàn)復(fù)制與粘貼操作實例
這篇文章主要介紹了javascript實現(xiàn)復(fù)制與粘貼操作,以實例形式講述了javascript實現(xiàn)復(fù)制與粘貼操作的實現(xiàn)方法,需要的朋友可以參考下
2014-10-10
判斷文字超過2行添加展開按鈕，未超過則不顯示，溢出部分顯示省略號
這篇文章主要介紹了判斷文字超過2行添加展開按鈕，未超過則不顯示，溢出部分顯示省略號，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2019-04-04
layui 解決富文本框form表單提交為空的問題
今天小編就為大家分享一篇layui 解決富文本框form表單提交為空的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-10-10