如何根据标题对许多表重新排序？答案

【问题标题】：How do I reorder many tables according to their caption?如何根据标题对许多表重新排序？
【发布时间】：2019-01-26 08:49:32
【问题描述】：

我想根据它们各自的标题按字母顺序对许多表重新排序。

例子：

目前，我有：

带有“PHP”标题的表格
带有“Javascript”标题的表格
带有“Android”标题的表格

我想看看：

带有“Android”标题的表格
带有“Javascript”标题的表格
带有“PHP”标题的表格

我不知道该怎么做。

这是我的代码：

$('table').each(function() {
    $caption = $(this).find('>caption');
    $table = $(this);
    $table.sort(function (a, b) {
        var $a = $(a),
        $b = $(b),
        aVal = $a.find(">caption").text().toLowerCase(),
        bVal = $a.find(">caption").text().toLowerCase();
        if (aVal < bVal) return -1;
        else if (aVal > bVal) return 1;
        else return 0;
    });
    $('#results').append($table);
});

【问题讨论】：

发布您的实际 HTML
sort 需要在所有表上完成 - $('table')，而不是在 each 内 - 分别在每个表上完成。
当前 HTML 代码：
php

Javascript
etc.

标签： javascript jquery sorting tablesort

【解决方案1】：

在遍历它们时无法对表进行排序。

首先，您可以获得每个表格的标题，然后将其与其对应的表格分组并将其推入数组中。现在对数组进行排序并显示内容。

var tables = [];
$('table').each(function() {
    var caption = $(this).find('caption')[0];
    tables.push({
       'table' : $(this),
       'caption': $(caption).text().toLowerCase()
    });
});
tables.sort(function (tableA, tableB){
    if (tableA.caption < tableB.caption){
        return -1;
    }
    if (tableA.caption > tableB.caption){
        return 1;
    }
    return 0;
});

$.each( tables, function( index, tableObject){
    $('#results').append(tableObject.table);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table> <caption>Zhp</caption> </table>
<table> <caption>php</caption> </table> 
<table> <caption>Javascript</caption> </table>



<div id="results"></div>

【讨论】：