本文详解如何使用 jquery 对多个 `.contest_entry` div 进行多级排序：优先按 `span.points` 数值**降序**排列，分数相同时再按 `span.times` 字符串（如 "09:55"）**升序**排序，确保高分优先、同分者用时更短者靠前。
在实际前端开发中，仅按单一字段排序往往无法满足业务逻辑需求。例如竞赛排行榜需“先看得分（越高越好），得分相同再比耗时（越短越好）”。上述需求正是典型的多条件复合排序场景。
原代码仅基于 points 降序排序，且存在两个关键问题：
- 使用 $(rhs) - $(lhs) 实现降序，逻辑易混淆；
- 未处理 times 字段的解析与比较——直接字符串比较 "12:39" > "09:55" 在 JavaScript 中是可行的（因 ISO 格式时间字符串具备字典序可比性），但需确保格式统一（如始终为 HH:MM，且补零）；
- 答案示例中误用了 .find(".child span.points")，而 HTML 结构中并无 .child 容器，应直接查找子元素 span.points 和 span.times。
✅ 正确、健壮的实现如下：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
$(function() {
var sortedList = $('.contest_entry').toArray().sort(function(lhs, rhs) {
// 提取并转换 points 值（容错：NaN 时设为 0）
var lhsPoints = parseInt($(lhs).children('span.points').text().trim(), 10) || 0;
var rhsPoints = parseInt($(rhs).children('span.points').text().trim(), 10) || 0;
// 主排序：points 降序 → 即 rhsPoints - lhsPoints
if (lhsPoints !== rhsPoints) {
return rhsPoints - lhsPoints;
}
// 次排序：times 升序（时间越早越靠前）
var lhsTime = $(lhs).children('span.times').text().trim();
var rhsTime = $(rhs).children('span.times').text().trim();
// 字符串比较适用于标准 HH:MM 格式（如 "09:55" < "12:39" ✅）
if (lhsTime < rhsTime) return -1;
if (lhsTime > rhsTime) return 1;
return 0;
});
$("#list").html(sortedList);
});? 关键说明与最佳实践：
- ✅ 使用 .children() 而非 .find() 更精准（避免嵌套干扰）；
- ✅ trim() 清除空格，防止 " 09:55 " 解析异常；
- ✅ || 0 防御性处理，避免 NaN 导致排序错乱；
- ✅ 时间字符串比较依赖其格式一致性；若需支持 "9:55" 或 "12:39:22"，建议统一解析为 Date 对象或分钟数再比较；
- ⚠️ 注意：.html(sortedList) 会替换整个 #list 内容，若需保留原有容器结构（如外层 ），此方式安全；但若 #list 内含其他非 .contest_entry 元素，将被清空——此时应改用 .append() 或先清空再注入。
最终排序结果示例（基于你的 HTML 数据）：
- points=19, times=17:19
- points=19, times=17:20
- points=19, times=17:34
- points=16, times=09:55
- points=14, times=12:39
该方案简洁、可扩展——如需新增第三级排序（如按用户名字母序），只需在 lhsPoints === rhsPoints && lhsTime === rhsTime 分支内追加逻辑即可。
