当前位置: 首页 > news >正文

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语句排序吧!

相关文章:

JavaScript排序

直接看代码 <table border"1" cellspacing"0"><thead class"tou"><tr><td>选择按钮</td><td>汽车编号</td><td>汽车图片</td><td>汽车系列名称</td><td>汽车能源</…...

【读书笔记】ICS设备及应用攻击(一)

工控系统通常是由互联设备所构成的大型复杂系统&#xff0c;这些设备包括类似于人机界面&#xff08;HMI&#xff09;、PLC、传感器、执行器以及其他使用协商好的协议进行相互通信的设备。所有交互背后的驱动力都是软件&#xff0c;软件为工控系统中几乎所有部分的运行提供支撑…...

网络原理(HTTP篇)

网络原理HTTP 前言HTTPHTTP的工作流程抓包工具抓取HTTP报文HTTP报文格式 请求报文具体细节首行URLURL的基本格式URL encode 方法 报头(header)HostContent-Length 和 Content-TypeUser-Agent&#xff08;UA&#xff09;RefererCookie&#xff08;重要&#xff09; 前言 如图&a…...

关于油封密封件你了解多少?

油封也称为轴封或旋转轴封&#xff0c;旨在防止设备中的润滑剂泄漏&#xff0c;并防止外部污染物进入机械。它们通常用于泵和电机等旋转设备&#xff0c;在固定部件和移动部件之间提供密封界面。 油封的有效性很大程度上取决于其材料。不同的材料具有不同程度的耐热性、耐压性…...

Leetcode 72 编辑距离

题意理解&#xff1a; 给你两个单词 word1 和 word2&#xff0c; 请返回将 word1 转换成 word2 所使用的最少操作数 。 你可以对一个单词进行如下三种操作&#xff1a; 插入一个字符 删除一个字符 替换一个字符 将word1转换为word2,可以进行三种操作&#xff1a;增、删、改&am…...

羊大师揭秘,如何挑选出好牧场的奶羊,该怎么看

羊大师揭秘&#xff0c;如何挑选出好牧场的奶羊&#xff0c;该怎么看 了解牧场的管理和环境&#xff1a;好的牧场应该有规范的管理制度&#xff0c;环境整洁&#xff0c;草场茂盛&#xff0c;为奶羊提供了充足的食物和良好的生活环境。在这样的牧场中&#xff0c;奶羊能够得到…...

MySQL数据库基础(八):DML数据操作语言

文章目录 DML数据操作语言 一、DML包括哪些SQL语句 二、数据的增删改&#xff08;重点&#xff09; 1、数据的增加操作 2、数据的修改操作 3、数据的删除操作 DML数据操作语言 一、DML包括哪些SQL语句 insert插入、update更新、delete删除 二、数据的增删改&#xff08…...

(09)Hive——CTE 公共表达式

目录 1.语法 2. 使用场景 select语句 chaining CTEs 链式 union语句 insert into 语句 create table as 语句 前言 Common Table Expressions&#xff08;CTE&#xff09;&#xff1a;公共表达式是一个临时的结果集&#xff0c;该结果集是从with子句中指定的查询派生而来…...

Spring 用法学习总结(四)之 JdbcTemplate 连接数据库

&#x1f409;目录 9 JdbcTemplate 9 JdbcTemplate Spring 框架对 JDBC 进行了封装&#xff0c;使用 JdbcTemplate 方便实现对数据库操作 相关包&#xff1a; 百度网盘链接https://pan.baidu.com/s/1Gw1l6VKc-p4gdqDyD626cg?pwd6666 创建properties配置文件 &#x1f4a5;注意…...

第 385 场 LeetCode 周赛题解

A 统计前后缀下标对 I 模拟 class Solution { public:int countPrefixSuffixPairs(vector<string> &words) {int n words.size();int res 0;for (int i 0; i < n; i)for (int j i 1; j < n; j)if (words[i].size() < words[j].size()) {int li words[…...

什么是RabbitMQ?

一、引言 RabbitMQ是一个开源的消息代理软件&#xff0c;用于在分布式系统中传递消息。它实现了高级消息队列协议&#xff08;AMQP&#xff09;&#xff0c;提供了一种可靠的、强大的、灵活的消息传递机制&#xff0c;使得不同应用程序或组件之间可以轻松地进行通信。 二、概念…...

JWT登录验证前后端设计与实现笔记

设计内容 前端 配置全局前置路由守卫axios拦截器登录页面和主页 后端 JWT的封装登录接口中间件放行mysql数据库的连接 详细设计 路由设计 配置全局前置守卫&#xff0c;如果访问的是登录页面则放行&#xff0c;不是则进入判断是否有token&#xff0c;没有则拦截回到登录…...

自定义类型详解 ----结构体,位段,枚举,联合

目录 结构体 1.不完全声明 2.结构体的自引用 3.定义与初始化 4.结构体内存对齐与结构体类型的大小 结构体嵌套问题 位段 1.什么是位段&#xff1f; 2.位段的内存分配 枚举 1.枚举类型的定义 2.枚举的优点 联合&#xff08;共同体&#xff09; 1.联合体类型的声明以…...

VueCLI核心知识综合案例TodoList

目录 1 拿到一个功能模块首先需要拆分组件&#xff1a; 2 使用组件实现静态页面的效果 3 分析数据保存在哪个组件 4 实现添加数据 5 实现复选框勾选 6 实现数据的删除 7 实现底部组件中数据的统计 8 实现勾选全部的小复选框来实现大复选框的勾选 9 实现勾选大复选框来…...

关于cuda路径问题

问题&#xff1a;Could not load dynamic library ‘libcudart.so.11.0’ 原因&#xff1a;调用系统环境下的cuda但系统环境没有装cuda 解决&#xff1a; 1.在系统环境装cuda&#xff0c;但如果每权限就不好操作&#xff1b; 2.用虚拟环境装好的cuda路径丢给环境变量 暂时性&am…...

六、Spring/Spring Boot整合ActiveMQ

Spring/Spring Boot整合ActiveMQ 一、Spring整合ActiveMQ1.pom.xml2.Queue - 队列2.1 applicationContext.xml2.2 生产者2.3 消费者 3.Topic - 主题3.1 applicationContext.xml3.2 生产者3.3 消费者 4.消费者 - 监听器4.1 编写监听器类4.2 配置监听器4.3 生产者消费者一体 二、…...

树莓派4B(Raspberry Pi 4B)使用docker搭建springBoot/springCloud服务

树莓派4B&#xff08;Raspberry Pi 4B&#xff09;使用docker搭建springBoot/springCloud服务 前提&#xff1a;本文基于Ubuntu&#xff0c;Java8&#xff0c;SpringBoot 2.6.13讲解 准备工作 准备SpringBoot/SpringCloud项目jar包 用 maven 打包springBoot/springCloud项目&…...

数据库设计、JDBC、数据库连接池

数据库设计 数据库设计概念 数据库设计就是根据业务 系统的具体需求&#xff0c;结合我们所选用的DBMS,为这个业务系统构造出最优的数据存储模型。建立数据库中的表结构以及表与表之间的关联关系的过程。有哪些表?表里有哪些字段?表和表之间有什么关系? 数据库设计的步骤…...

SpringBoot实现OneDrive文件上传

SpringBoot实现OneDrive文件上传 源码 OneDriveUpload: SpringBoot实现OneDrive文件上传 获取accessToken步骤 参考文档&#xff1a;针对 OneDrive API 的 Microsoft 帐户授权 - OneDrive dev center | Microsoft Learn 1.访问Azure创建应用Microsoft Azure&#xff0c;使…...

C++初阶:容器适配器介绍、stack和queue常用接口详解及模拟实现

介绍完了list类的相关内容后&#xff1a;C初阶&#xff1a;适合新手的手撕list&#xff08;模拟实现list&#xff09; 接下来进入新的篇章&#xff0c;stack和queue的介绍以及模拟&#xff1a; 文章目录 1.stack的初步介绍2.stack的使用3.queue的初步介绍4.queue的使用5.容器适…...

Python内存泄漏分析实战指南(生产环境零停机排查全流程)

第一章&#xff1a;Python内存泄漏的本质与危害Python内存泄漏并非源于C语言中常见的“未释放malloc内存”&#xff0c;而是指对象被意外长期持有&#xff0c;导致垃圾回收器&#xff08;GC&#xff09;无法将其回收&#xff0c;从而持续占用堆内存。其本质是**引用关系的非预期…...

TTL串口设计及其注意事项

一、TTL串口设计概述我们常见的处理器&#xff08;单片机&#xff09;引出来的串口是UART、USART,其中有没有S取决于有没有时钟信号&#xff08;SLK&#xff09;&#xff0c;出来的电平是TTL电平&#xff0c;常见的UART串口设计有3线串口设计&#xff0c;单线串口设计&#xff…...

告别手动更新!GAMIT/GLOBK数据处理中tables表文件的自动化管理与避坑指南

告别手动更新&#xff01;GAMIT/GLOBK数据处理中tables表文件的自动化管理与避坑指南 在GNSS数据处理领域&#xff0c;GAMIT/GLOBK作为科研和工程项目的核心工具链&#xff0c;其精度和可靠性高度依赖于各类表文件的及时更新。然而&#xff0c;许多中高级用户在实际操作中常陷…...

解锁学术新姿势:书匠策AI——毕业论文的“全能工匠”

在学术探索的征途中&#xff0c;毕业论文如同一座巍峨的山峰&#xff0c;既是对过往学习成果的全面检验&#xff0c;也是通往未来学术或职业道路的关键一步。然而&#xff0c;面对这座“大山”&#xff0c;许多学子常常感到力不从心&#xff0c;从选题迷茫到内容匮乏&#xff0…...

Qwen3-TTS在心理治疗中的应用:情感化语音陪伴系统

Qwen3-TTS在心理治疗中的应用&#xff1a;情感化语音陪伴系统 1. 引言 想象一下这样的场景&#xff1a;一位正在经历焦虑情绪的用户&#xff0c;深夜无法入睡&#xff0c;需要即时的情感支持。传统的心理咨询需要预约等待&#xff0c;而此刻他们最需要的是一个能够理解、回应…...

ChatGLM3-6B新手必看:断网可用的本地智能对话解决方案

ChatGLM3-6B新手必看&#xff1a;断网可用的本地智能对话解决方案 1. 引言&#xff1a;为什么你需要一个本地AI助手&#xff1f; 想象一下&#xff0c;你正在处理一份敏感的客户合同&#xff0c;需要AI帮你分析条款&#xff1b;或者你在一个没有稳定网络的环境里&#xff0c;…...

Django 学习日记(补充1)| 彻底吃透:自定义 JWT 认证 + 全局登录中间件

大家好&#xff0c;这是我 Django 学习日记的第三篇。上一篇我们把路由、反向解析、DRF 自动路由、媒体文件、跨域全部讲明白了。今天我们进入整个项目最核心、最安全、最关键的部分&#xff1a;用户登录认证体系&#xff08;在进入视图前的一篇补充文章&#xff09;。本文将从…...

JavaScript动态交互:在网页中实时调整参数并预览LiuJuan生成效果

JavaScript动态交互&#xff1a;在网页中实时调整参数并预览LiuJuan生成效果 你是不是也遇到过这种情况&#xff1f;想用AI模型生成图片&#xff0c;但每次调整参数都要在代码里改来改去&#xff0c;然后重新运行脚本&#xff0c;等半天才能看到效果。整个过程就像在开盲盒&am…...

【调试心法】别用 printf 谋杀你的系统了!打破“测不准”魔咒,用 C++ 与 DMA 构筑微秒级零开销异步观测者

摘要&#xff1a;在硬实时控制系统中&#xff0c;最可怕的 Bug 往往是薛定谔的 Bug——当你试图用 printf 去观察它时&#xff0c;观察行为本身产生的巨大延迟&#xff0c;就足以改变系统的物理运行轨迹。本文将无情揭露同步串口打印的耗时真相&#xff0c;批判阻塞式调试对高频…...

PX4飞控系统深度解析:从模块化架构到自主飞行核心技术揭秘

PX4飞控系统深度解析&#xff1a;从模块化架构到自主飞行核心技术揭秘 【免费下载链接】PX4-Autopilot PX4 Autopilot Software 项目地址: https://gitcode.com/gh_mirrors/px/PX4-Autopilot 你是否曾好奇&#xff0c;一个开源飞控系统如何支撑从微型无人机到工业级无人…...