这篇文章主要介绍了JavaScript实现表格点击排序的方法,可实现点击顶部数据项标题实现对应数据列的排序效果,涉及javascript鼠标事件及数据排序的技巧,需要的朋友可以参考下
本文实例讲述了JavaScript实现表格点击排序的方法。分享给大家供大家参考。具体分析如下：
这里实现基于JS的表格点击排序效果，可以根据表格内的数据大小自动按顺序排列，股票网站常会见到这种功能。
表格排序
| 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 | |