【javascript】根据表格中的某一列进行排序

2024-06-11 19:38

本文主要是介绍【javascript】根据表格中的某一列进行排序,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

<script type="text/javascript">var b = true ;function sortAge(){var tabNode = document.getElementsByTagName("table")[0];var trNodes = tabNode.rows;  //获取表格中的行对象var arr = new Array();for(var x=1;x<trNodes.length;x++){  //临时容器存入的是表格中行对象的引用arr[x-1] = trNodes[x];}sort(arr);var tbdNode = tabNode.childNodes[0];	if(b){                                  //if....else...控制按年龄的升降进行排序for(var x=0;x<arr.length;x++){tbdNode.appendChild(arr[x]);}b = false; }else{for(var x=arr.length-1;x>=0;x--){tbdNode.appendChild(arr[x]);}b = true ;}	}function sort(arr){ // 排序for(var x=0;x<arr.length;x++){for(var y=x+1;y<arr.length;y++){if(parseInt(arr[x].cells[1].innerText)>parseInt(arr[y].cells[1].innerText)){ // 不进行parseInt转换是以字符串的ASCII比较var temp = arr[x];arr[x] = arr[y];arr[y] = temp;}}}}
</script><style type="text/css">table{ width:60%; border:solid 1px #0066FF;}table td {border:solid 1px #0099ff;}a{ text-decoration: none;}
</style></head>
<body><table><tr><td>姓名</td><td><a href="javascript:void(0)" οnclick="sortAge()">年龄</a></td><td>地址</td></tr><tr><td>张三</td><td>23</td><td>北京</td></tr><tr><td>李四</td><td>25</td><td>上海</td></tr><tr><td>王五</td><td>15</td><td>广州</td></tr><tr><td>唐总</td><td>20</td><td>长沙</td></tr></table>
</body>

这篇关于【javascript】根据表格中的某一列进行排序的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1052099

相关文章

SpringBoot基础框架详解

《SpringBoot基础框架详解》SpringBoot开发目的是为了简化Spring应用的创建、运行、调试和部署等,使用SpringBoot可以不用或者只需要很少的Spring配置就可以让企业项目快... 目录SpringBoot基础 – 框架介绍1.SpringBoot介绍1.1 概述1.2 核心功能2

Spring Boot 事务详解(事务传播行为、事务属性)

《SpringBoot事务详解(事务传播行为、事务属性)》SpringBoot提供了强大的事务管理功能,通过@Transactional注解可以方便地配置事务的传播行为和属性,本文将详细介绍Spr... 目录Spring Boot 事务详解引言声明式事务管理示例编程式事务管理示例事务传播行为1. REQUI

Spring AI 实现 STDIO和SSE MCP Server的过程详解

《SpringAI实现STDIO和SSEMCPServer的过程详解》STDIO方式是基于进程间通信,MCPClient和MCPServer运行在同一主机,主要用于本地集成、命令行工具等场景... 目录Spring AI 实现 STDIO和SSE MCP Server1.新建Spring Boot项目2.a

spring security 超详细使用教程及如何接入springboot、前后端分离

《springsecurity超详细使用教程及如何接入springboot、前后端分离》SpringSecurity是一个强大且可扩展的框架,用于保护Java应用程序,尤其是基于Spring的应用... 目录1、准备工作1.1 引入依赖1.2 用户认证的配置1.3 基本的配置1.4 常用配置2、加密1. 密

Spring Boot 集成 Solr 的详细示例

《SpringBoot集成Solr的详细示例》:本文主要介绍SpringBoot集成Solr的详细示例,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧... 目录环境准备添加依赖配置 Solr 连接定义实体类编写 Repository 接口创建 Service 与 Controller示例运行

Spring Cloud GateWay搭建全过程

《SpringCloudGateWay搭建全过程》:本文主要介绍SpringCloudGateWay搭建全过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录Spring Cloud GateWay搭建1.搭建注册中心1.1添加依赖1.2 配置文件及启动类1.3 测

Java如何将文件内容转换为MD5哈希值

《Java如何将文件内容转换为MD5哈希值》:本文主要介绍Java如何将文件内容转换为MD5哈希值的实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Java文件内容转换为MD5哈希值一个完整的Java示例代码代码解释注意事项总结Java文件内容转换为MD5

Spring Boot拦截器Interceptor与过滤器Filter深度解析(区别、实现与实战指南)

《SpringBoot拦截器Interceptor与过滤器Filter深度解析(区别、实现与实战指南)》:本文主要介绍SpringBoot拦截器Interceptor与过滤器Filter深度解析... 目录Spring Boot拦截器(Interceptor)与过滤器(Filter)深度解析:区别、实现与实

解决Java异常报错:java.nio.channels.UnresolvedAddressException问题

《解决Java异常报错:java.nio.channels.UnresolvedAddressException问题》:本文主要介绍解决Java异常报错:java.nio.channels.Unr... 目录异常含义可能出现的场景1. 错误的 IP 地址格式2. DNS 解析失败3. 未初始化的地址对象解决

Python对PDF书签进行添加,修改提取和删除操作

《Python对PDF书签进行添加,修改提取和删除操作》PDF书签是PDF文件中的导航工具,通常包含一个标题和一个跳转位置,本教程将详细介绍如何使用Python对PDF文件中的书签进行操作... 目录简介使用工具python 向 PDF 添加书签添加书签添加嵌套书签Python 修改 PDF 书签Pytho