js 静态HTML表格排序功能实现

Chloe ·

更新时间:2024-11-13

· 931 次阅读

<b> 
<b> 
<title>无标题文档</title> 
*{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;} 
</b> 
<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>15.43</td> 
<td class="red">700</td> 
<td>1.220</td> 
<td class="red">阿</td> 
</tr> 
<tr><td>7.05</td> 
<td class="red">4</td> 
<td>3,000</td> 
<td class="red">炳</td> 
</tr> 
<tr><td>30.62</td> 
<td class="red">30</td> 
<td>2,558,800</td> 
<td class="red">和</td> 
</tr> 
<tr> 
<td>22.30</td> 
<td class="red">5</td><td>6</td> 
<td class="red">瞎</td> 
</tr> 
<tr><td>26.31</td> 
<td class="red">0.6</td><td>5</td> 
<td class="red">-</td> 
</tr> 
<tr><td>63.16</td> 
<td class="red">7</td><td>4</td> 
<td class="red">子</td> 
</tr> 
</table> 
</b>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

HTML 排序 js html表格

1024 个赞

需要登录后方可回复, 如果你还没有账号请注册新账号

相关文章

Java switch case 语句

Karli 2021-03-06

944

Foundation 提醒框

Sally 2021-01-16

813

Highcharts 散点图

Xena 2020-07-03

780

CSS3制作酷炫的三维相册效果

Efia 2020-11-23

733

js中find、findIndex、indexOf的用法和区别

Iola 2023-07-20

1102

js控制台报错UncaughtTypeError:Cannotreadpropertiesofundefined(reading‘appendChild‘)的解决

Kara 2023-07-20

382

js中的柯里化与反柯里化的基础概念和用法

Viridis 2023-07-20

1851

JS算法题解旋转数组方法示例

Dara 2023-07-20

1477

js类型判断内部实现原理示例详解

Tertia 2023-07-20

999

JS中varlet声明范围区别详解

Zada 2023-07-20

576

JS实现数组内值累加常见的3个方法

Rhea 2023-07-20

176

JS实现深拷贝的4种方式介绍

Lani 2023-07-20

366

JS将字符串中指定字符全局替换的方法

Hazel 2023-07-20

347

vue 导入js中的两种方法(示例详解)

Sue 2023-07-20

1879

JS中数组合并的几种常见方法

Antonia 2023-07-20

756

使用html2canvas截图不全问题的解决办法

Zada 2023-07-20

776

react实现记录拖动排序

Jacinda 2023-07-20

1927

js控制滚动条滚动的两种简单方法

Zahirah 2023-07-20

518

JS中6个对象数组去重的方法

Rae 2023-07-20

1383

JS之延时器和定时器执行示例详解

Vala 2023-07-20

874

我要提问

致谢

帮助他人，成就自己。

人生最大成功就是伸出热情而温暖的双手，尽自己所能去帮助身边的每一个人，只要无私的奉献，就会收获到美好的生活。

1024问感谢每一位朋友的帮助和支持。

软件开发网提供编程的基础软件技术培训教程,软件开发编程实例讲解Go,Node,HTML,CSS,Javascript,Python,Java,Ruby,C,PHP,MySQL等软件开发编程语言以及数据开发的基础知识，也提供大量的软件开发在线实例、从入门到精通就在1024问。

育儿网微养生全球行美食街育儿菜谱大全海南旅游女性养狗百科星座