JavaScript实现表格点击排序的方法

本文实例讲述了Javascript实现表格点击排序的方法。分享给大家供大家参考。具体分析如下：

这里实现基于JS的表格点击排序效果，可以根据表格内的数据大小自动按顺序排列，股票网站常会见到这种功能。

TABLE {
 BORDER-RIGHT: #000000 2px solid; BORDER-TOP: #000000 2px solid;
 BORDER-LEFT: #000000 2px solid; BORDER-BOTTOM: #000000 2px solid;
 border-spacing: 0px; cell-spacing: 0px
}
TD {
 PADDING-RIGHT: 0.5em; PADDING-LEFT: 0.5em; FONT-SIZE: 10pt;
 PADDING-BOTTOM: 2px; PADDING-TOP: 2px; 
 FONT-FAMILY: Arial, Helvetica, sans-serif; WHITE-SPACE: nowrap
}
TH {
 PADDING-RIGHT: 0.5em; PADDING-LEFT: 0.5em; FONT-SIZE: 10pt;
 PADDING-BOTTOM: 2px; PADDING-TOP: 2px;
 FONT-FAMILY: Arial, Helvetica, sans-serif; WHITE-SPACE: nowrap
}
TD.numeric {
 TEXT-ALIGN: right
}
TH {
 BACKGROUND-COLOR: #c0c0c0
}
TH.mainHeader {
 COLOR: #ffffff; BACKGROUND-COLOR: #808080; TEXT-ALIGN: left
}
TH A {
 COLOR: #000080; TEXT-DECORATION: none
}
TH A:visited {
 COLOR: #000080
}
TH A:active {
 COLOR: #800000; TEXT-DECORATION: underline
}
TH A:hover {
 COLOR: #800000; TEXT-DECORATION: underline
}
TR.alternateRow {
 BACKGROUND-COLOR: #e0e0e0
}
TD.sortedColumn {
 BACKGROUND-COLOR: #f0f0f0
}
TH.sortedColumn {
 BACKGROUND-COLOR: #b0b0b0
}
TR.alternateRow TD.sortedColumn {
 BACKGROUND-COLOR: #d0d0d0
}






 

 

  
NFL 2001 Offensive Stats
 

  
Rank
  
Team
  
Gms
  
Yds
  
Yds/G
  
RuYds
  
RuYds/G
  
PaYds
  
PaYds/G
  
Pts
  
Pts/G
 

 

  

  
Arizona
  
16
  
4898
  
306.1
  
1449
  
90.6
  
3449
  
215.6
  
295
  
18.4
 

  

  
Atlanta
  
16
  
5070
  
316.9
  
1773
  
110.8
  
3297

  
206.1
  
291
  
18.2


  
Detroit
  
16
  
4994
  
312.1
  
1398
  
87.4
  
3596
  
224.8
  
270
  
16.9
 

  

  
Jacksonville
  
16
  
4840
  
302.5
  
1600
  
100.0
  
3240
  
202.5
  
294
  
18.4
 

  

  
Kansas City
  
16
  
5673
  
354.6
  
2008
  
125.5
  
3665
  
229.1
  
320
  
20.0
 

  

  
Miami
  
16
  
4821
  
301.3
  
1664
  
104.0
  
3157
  
197.3
  
344
  
21.5
 

  

  
Minnesota
  
16
  
5006
  
333.7
  
1523
  
101.5
  
3483
  
232.2
  
287
  
19.1
 

  

  
New England
  
16
  
4882
  
305.1
  
1793
  
112.1
  
3089
  
193.1
  
371
  
23.2
 

  

  
New Orleans
  
16
  
5226
  
326.6
  
1712
  
107.0
  
3514
  
219.6
  
333
  
20.8
 

  

  
New York Giants
  
16
  
5335
  
333.4
  
1777
  
111.1
  
3558
  
222.4
  
294
  
18.4

希望本文所述对大家的javascript程序设计有所帮助。