JavaScript排序

直接看代码

<table border="1" cellspacing="0"><thead class="tou"><tr><td>选择按钮</td><td>汽车编号</td><td>汽车图片</td><td>汽车系列名称</td><td>汽车能源</td><td>汽车报价</td><td>汽车特点</td><td>汽车类型</td><td class="gn">功能</td></tr></thead><tbody class="shenti"><c:forEach items="${lb }" var="l" varStatus="li"><tr class="t"><td><input type="checkbox" class="cx" value="${l.cid }"/></td><td>${li.count }</td><td><img src="${l.cimg}" style="width: 160px;height: 90px"></td><td>${l.csy }</td><td>${l.cny }</td><td class="bj">${l.cprice }</td><td>${l.ctd }</td><td>${l.tyname }</td><td><input type="button" value="修改" class="anniu1" οnclick="xg(${l.cid})"/><input type="button" value="删除" class="anniu2" οnclick="sc(${l.cid})"/></td></tr></c:forEach></tbody>
</table>

//升序排序
function sxpx(){//创建两个数组let arr1=[];let arr2=[];$(".t").each(function (i){arr1[i]=$(this).html();})$(".bj").each(function (i){arr2[i]=Number($(this).html());})//冒泡排序for (let i = 0; i < arr2.length-1; i++) {for (let j = 0; j < arr2.length-1-i; j++) {if (arr2[j]>arr2[j+1]){//小数组排序let temp2=arr2[j];arr2[j]=arr2[j+1];arr2[j+1]=temp2;//大数组排序let temp1=arr1[j];arr1[j]=arr1[j+1];arr1[j+1]=temp1;}}}$(".t").each(function (i){$(this).html(arr1[i]);})
}
//降序排序
function jxpx(){//创建两个数组let arr1=[];let arr2=[];$(".t").each(function (i){arr1[i]=$(this).html();})$(".bj").each(function (i){arr2[i]=Number($(this).html());})//冒泡排序for (let i = 0; i < arr2.length-1; i++) {for (let j = 0; j < arr2.length-1-i; j++) {if (arr2[j]<arr2[j+1]){//小数组排序let temp2=arr2[j];arr2[j]=arr2[j+1];arr2[j+1]=temp2;//大数组排序let temp1=arr1[j];arr1[j]=arr1[j+1];arr1[j+1]=temp1;}}}$(".t").each(function (i){$(this).html(arr1[i]);}

}

 如果让我自己写的话,我也有点懵,但思路我是理解的,蓝色部分分别是给列表全页面和要排序的列设置class,然后开始排序。

首先,创建两个数组,用each遍历全页面和要排序的列,分别装到连两个数组中,然后进行冒泡排序,排序是对要排序的那个数组进行冒泡,我们看见有小数组排序和大数组排序,因为当列表页面一列动了,那其它列是不是也要跟着动,数组才是正确的,所以大数组跟着小数组的排序规则进行排序就可以了,组后大数组arr1排完后,将整体的数据给放到以前的数组中就可以了,升序变降序,降序变升序,就把比较符号换换就可以了,逻辑不是很绕,到写起来头晕😔,大家能用sql语句排序就用sql语句排序吧!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/689940.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Android 基础技术——Binder 机制

笔者希望做一个系列&#xff0c;整理 Android 基础技术&#xff0c;本章是关于Binder 机制 什么是Binder 机制&#xff1a;Binder 是一种进程间通信机制 驱动&#xff1a;Binder 是一个虚拟物理设备驱动 应用层&#xff1a;Binder 是一个能发起通信的 Java 类 为什么要使用Bind…

react封装通用Modal弹窗组件

目录 1、【src/component/modal/hoc.js】 2、【src/component/modal/componentModal.js】 3、【src/page/projectView.js】 【说明】&#xff1a;后台管理的项目中会经常遇到弹窗&#xff0c;于是封装了一个简单的公共弹窗组件 这个公共组件不适用复杂的功能&#xff0c;简单的…

20. 【Linux教程】emacs 编辑器

前面小节介绍了如何使用 vim 编辑器和 nano 编辑器&#xff0c;本小节介绍 emacs 编辑器&#xff0c;emacs 编辑器最开始是作为控制台的编辑器&#xff0c;并且 emacs 编辑器仍然提供最早的命令行模式。 1. 检查 Linux 系统中是否安装 emacs 编辑器 使用如何命令检查 emacs 编…

SpringIOC之support模块SimpleThreadScope

博主介绍:✌全网粉丝5W+,全栈开发工程师,从事多年软件开发,在大厂呆过。持有软件中级、六级等证书。可提供微服务项目搭建与毕业项目实战,博主也曾写过优秀论文,查重率极低,在这方面有丰富的经验✌ 博主作品:《Java项目案例》主要基于SpringBoot+MyBatis/MyBatis-plus+…

JavaScript:循环与遍历

文章目录 循环ForFor-of (ES6)For-inWhileDo-While注意以上for与while方法均支持break与continue 数组遍历(不支持break与continue&#xff0c;return只是结束当前的回调函数执行)Array.prototype.forEach()Array.prototype.map()Array.prototype.filter()Array.prototype.redu…

PAM | 账户安全 | 管理

PAM PAM&#xff08;Pluggable Authentication Modules&#xff0c;可插入式身份验证模块&#xff09;是一个灵活的身份验证系统&#xff0c;允许我们通过配置和组合各种模块来实现不同的身份验证策略。 在 Linux 或类 Unix 系统中&#xff0c;常见的 PAM 模块包括以下几种类…

NLP-词袋模型

词袋模型是自然语言处理中常用的一种文本表示方法&#xff0c;用于将文本转换为数值型向量&#xff0c;以便于计算机进行处理和分析。在词袋模型中&#xff0c;文本被看作是一个由词语组成的集合&#xff0c;而每个词语都是独立的&#xff0c;不考虑它们在文本中的顺序和语境关…

Fabric中的溯源方法

背景 在Fabric链码中&#xff0c;我们可以使用PutState方法对一个key的值进行覆盖&#xff0c;当我们再使用GetState查询时是最新的值。如果我们希望找到这个key的修改记录&#xff0c;我们可以使用溯源方法GetHistoryForKey。完整源码链接&#xff1a;https://github.com/hyp…

零基础搭建 Kubernetes 集群

零基础搭建 Kubernetes 集群 1、简介 在数字化时代&#xff0c;容器技术已经变成了软件开发和部署的标准&#xff0c;而在众多容器管理工具中&#xff0c;Kubernetes&#xff08;简称为 K8s&#xff09;凭借其高效的资源管理、弹性伸缩和自我修复的能力&#xff0c;成为了行业…

Vue3学习——响应式原理

vue2原理 对象类型&#xff1a;通过Object.defineProperty()对属性的读取、修改进行拦截&#xff08;数据劫持&#xff09;。数组类型&#xff1a;通过重写更新数组的一系列方法来实现拦截。&#xff08;对数组的变更方法进行了包裹&#xff09;。 问题&#xff1a; 新增属性…

文件 IO 2月18日学习笔记

标准IO和文件IO的区别&#xff1a; 1.标准IO是库函数,是对系统调用的封装 2.文件IO是系统调用,是Linux内核中的函数接口 3.标准IO是有缓存的 4.文件IO是没有缓存的 文件IO: 1.操作步骤&#xff1a; 打开 -> 读/写 -> 关闭 2.打开文…

多线程、分布式运行用例

python多线程 threading模块 多线程实例 # -*- coding: utf-8 -*- # Time : 2024/2/7 15:50 # Author : 居里夫人吃橘子 # File : class01.py # Software: PyCharm import threading from time import sleepdef run(name):print(name 该起床了)sleep(2)print(name …

Linux CentOS系统安装SQL Server并结合内网穿透实现公网访问本地数据

&#x1f525;博客主页&#xff1a; 小羊失眠啦. &#x1f3a5;系列专栏&#xff1a;《C语言》 《数据结构》 《C》 《Linux》 《Cpolar》 ❤️感谢大家点赞&#x1f44d;收藏⭐评论✍️ 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&…

Ubuntu在终端编辑完配置文件怎么保存退出?

1.退出&#xff0c;按【Ctrlx】&#xff0c;回车键。 2.保存&#xff0c;则先按【Ctrlo】&#xff0c;回车键&#xff0c;再按【Ctrlx】退出

小白水平理解面试经典题目LeetCode 1025 Divisor Game【动态规划】

1025 除数游戏 小艾 和 小鲍 轮流玩游戏&#xff0c;小艾首先开始。 最初&#xff0c;黑板上有一个数字 n 。在每个玩家的回合中&#xff0c;该玩家做出的动作包括&#xff1a; 选择任意 x&#xff0c;使 0 < x < n 和 n % x 0 。将黑板上的数字 n 替换为 n - x 。 此…

Dom节点继承树基本操作

遍历节点树 基于元素节点树的遍历 parcntElcrmcnt -> 返回当前元素的父元秦节点 (IE不兼容)children ->只返回当前元素的元素子节点node.childFlement(ount nodechildren.length当前元素节点的子元素(IE不兼容)firstElementChild->返回的是第一个元素节点(IE不兼容)l…

IDEA-常用插件

1、Mybatis Log Free 当我们使用mybatis log在控制台输出sql 内容&#xff0c;输出内容将语句与参数分开打印&#xff0c;还需要手动将参数替换到指定位置。 使用对应插件后&#xff0c;自动将输出内容组装成完整的可直接执行的SQL 在插件市场 查看对应名称&#xff0c;并安装。…

【数据结构】图的存储与遍历

图的概念 图是由顶点集合及顶点间的关系组成的一种数据结构&#xff1a;G (V&#xff0c; E) 图分为有向图和无向图 在有向图中&#xff0c;顶点对<x, y>是有序的&#xff0c;顶点对<x&#xff0c;y>称为顶点x到顶点y的一条边(弧)&#xff0c;<x, y>和&l…

基于微信小程序的校园跑腿系统的研究与实现,附源码

博主介绍&#xff1a;✌程序员徐师兄、7年大厂程序员经历。全网粉丝12w、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专栏推荐订阅&#x1f447;…

轻松入门MySQL:优化复杂查询,使用临时表简化数据库查询流程(13)

在进销存管理系统中&#xff0c;复杂的数据查询是司空见惯的。这些查询往往需要处理大量的数据&#xff0c;并执行复杂的逻辑操作。然而&#xff0c;处理这些查询可能会变得非常耗时&#xff0c;并且难以维护。为了解决这个问题&#xff0c;我们可以利用临时表&#xff0c;这是…