快捷導(dǎo)航

js 靜態(tài)HTML表格排序功能實(shí)現(xiàn)

更新時(shí)間：2009年02月11日 09:57:36 作者：

對(duì)于對(duì)于一些表格按價(jià)格等進(jìn)行排序，方便用戶對(duì)當(dāng)前頁面的高低價(jià)格排序，用戶體驗(yàn)性好

<!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=gb2312" /> <title>無標(biāo)題文檔</title> <style> *{font-family:Arial, Helvetica, sans-serif;font-size:14px;border:none;} body{text-align:center;} table{margin:100px auto;} td{width:100px;height:24px;text-align:center;line-height:24px;border:1px solid silver;} .red{color:red;} .top{background:#CCCCCC;cursor:pointer;} .up{background:#FFFFCC url(/upload/20090211095733175.gif) no-repeat right 5px;} .down{background:#FFFFCC url(/upload/20090211095734843.gif) no-repeat right 5px;} .hov{background:#F0EFE5;} </style> </head> <body> <table cellpadding="0" id="table"> <tr class="top"><td>kick me</td><td >kick me</td><td>kick me</td><td>kick me</td></tr> <tr> <td><span id="bfn_la_bac.usa">15.43</span></td> <td class="red">700</td> <td>1.220</td> <td class="red">阿</td> </tr> <tr><td><span id="bfn_la_c.usa">7.05</span></td> <td class="red">4</td> <td>3,000</td> <td class="red">炳</td> </tr> <tr><td><span id="bfn_la_jpm.usa">30.62</span></td> <td class="red">30</td> <td>2,558,800</td> <td class="red">和</td> </tr> <tr> <td><span id="bfn_la_axp.usa">22.30</span></td> <td class="red">5</td><td>6</td> <td class="red">瞎</td> </tr> <tr><td><span id="bfn_la_mrk.usa">26.31</span></td> <td class="red">0.6</td><td>5</td> <td class="red">-</td> </tr> <tr><td><span id="bfn_la_pg.usa">63.16</span></td> <td class="red">7</td><td>4</td> <td class="red">子</td> </tr> </table>  </body> </html>

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

您可能感興趣的文章:

相關(guān)文章

微信小程序頁面渲染實(shí)現(xiàn)方法
這篇文章主要介紹了微信小程序頁面渲染實(shí)現(xiàn)方法,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2019-11-11
談一談javascript閉包
這篇文章主要介紹了javascript閉包，閉包（closure）是Javascript語言的一個(gè)難點(diǎn)，也是它的特色，很多高級(jí)應(yīng)用都要依靠閉包實(shí)現(xiàn)，感興趣的小伙伴們可以參考一下
2016-01-01
javascript實(shí)現(xiàn)的網(wǎng)站訪問量統(tǒng)計(jì)代碼
本文文章通過兩段代碼實(shí)例給大家介紹了基于javascript實(shí)現(xiàn)網(wǎng)站訪問量統(tǒng)計(jì)代碼，對(duì)js實(shí)現(xiàn)網(wǎng)站訪問量統(tǒng)計(jì)相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧
2015-12-12
Javascript中typeof 用法小結(jié)
JavaScript中的typeof其實(shí)非常復(fù)雜,他有六種返回的數(shù)據(jù)類型，它可以用來做很多事情,但同時(shí)也有很多怪異的表現(xiàn).本文列舉出了它的多個(gè)用法,有需要的小伙伴可以參考下。
2015-05-05
JS實(shí)現(xiàn)多功能計(jì)算器
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)多功能計(jì)算器，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-10-10
javascript實(shí)現(xiàn)數(shù)組去重的多種方法
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)數(shù)組去重的多種方法，感興趣的小伙伴們可以參考一下
2016-03-03
amd、cmd、esmodule、commonjs區(qū)別詳解
本文主要介紹了amd、cmd、esmodule、commonjs區(qū)別詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2023-04-04
redux.js詳解及基本使用
Redux我們可以把它理解成一個(gè)狀態(tài)管理器，可以把狀態(tài)（數(shù)據(jù)）存在Redux中，以便增、刪、改。這篇文章主要介紹了redux.js詳解及基本使用,需要的朋友可以參考下
2019-05-05
隨窗體滑動(dòng)的小插件sticky源碼
隨窗體滑動(dòng)的小插件sticky源碼，需要的朋友可以參考一下
2013-06-06
html的DOM中document對(duì)象anchors集合用法實(shí)例
這篇文章主要介紹了html的DOM中document對(duì)象anchors集合用法,實(shí)例分析了anchors集合的功能及使用技巧,需要的朋友可以參考下
2015-01-01