Javascript 对子行数据进行排序并将父行与子组一起移动

我有这样的桌子：

<table>
    <tr class="parent">
        <th id="apple">Apple</th>
        <th id="orange">Orange</th>
        <th>Banana</th>
    </tr>
    <tr class="parent">
        <td>Apple</td>
        <td>Orange</td>
        <td>Banana</td>
    </tr>
    <tr class="child">
        <td>Apple 1</td>
        <td>Orange 1</td>
        <td>Banana 1</td>
    </tr>
    <tr class="child">
        <td>Apple 2</td>
        <td>Orange 2</td>
        <td>Banana 2</td>
    </tr>
    <tr class="parent">
        <td>Table</td>
        <td>cHAIR</td>
        <td>Mouse</td>
    </tr>
    <tr class="child">
        <td>Table 1</td>
        <td>cHAIR 1</td>
        <td>Mouse 1</td>
    </tr>
    <tr class="child">
        <td>Table 2</td>
        <td>cHAIR 2</td>
        <td>Mouse 2</td>
    </tr>
</table>

苹果
橙色
香蕉
苹果
橙色
香蕉
苹果1
橙色1
香蕉1
苹果2
橙色2
香蕉2
桌子
椅子
老鼠
表1
主席1
鼠标1
表2
主席2
鼠标2

我想在单击

时对仅有的子行数据进行排序，并将父tr与子tr一起移动。我无法这样做，因为它只有一个表

---

我目前使用的代码是：

我想我现在明白你想要什么了。我认为您需要使用父对象对组之间的组进行排序，并对组中的子对象进行排序

$('th').click(function() {
    //remove and group
    var groups = [];
    $(this).parent().siblings().each(function() {
        $(this).detach();
        if($(this).hasClass('parent')) {
            groups.push({parent:$(this), children:[]});
        } else {
            groups[groups.length-1].children.push($(this));
        }
    });

    //sort, inter-group, and intra-group
    var i = $(this).index();
    function compareRows(rowA, rowB) {
        var a = $(rowA.children()[i]).text();
        var b = $(rowB.children()[i]).text();
        return a < b ? -1 : a > b ? 1 : 0;
    }
    groups.sort(function(groupA, groupB) {
        return compareRows(groupA.parent, groupB.parent);
    });
    $.each(groups, function(_, group) {
        group.children.sort(compareRows);
    });

    //reinsert
    var table = $(this).parent().parent();
    $.each(groups, function(_, group) {
        table.append(group.parent).append(group.children);
    });
});

$（'th'）。单击（函数（）{
//删除并分组
var组=[]；
$（this）.parent（）.sides（）.each（function（））{
$（this.detach（）；
if（$（this）.hasClass（'parent'））{
push（{parent:$（this），children:[]}）；
}否则{
groups[groups.length-1].children.push（$（this））；
}
});
//排序、组间和组内
var i=$（this.index（）；
函数比较器视图（行A、行B）{
var a=$（rowA.children（）[i]）.text（）；
var b=$（rowB.children（）[i]）.text（）；
返回ab-1:0；
}
groups.sort（函数（groupA、groupB）{
返回compareRows（groupA.parent、groupB.parent）；
});
$.each（组，函数（u，组）{
group.children.sort（compareRows）；
});
//重新插入
var table=$（this.parent（）.parent（）；
$.each（组，函数（u，组）{
table.append（group.parent）.append（group.children）；
});
});

---

请澄清您的意图是否是其他的。

我想您想按该列中的父值排序？我没有在我的代码中检查您的代码，但根据您的评论，此代码正在排序父数据并将子项与父项一起移动。。但是我需要对子行数据进行排序，并希望使用这个函数沿着prev（）+最近的（）tr移动。我认为这没有道理。有可能吗？那么，当一个孩子是第一个，另一个是最后一个时会发生什么呢？家长去哪里？请建议最好的方法是什么，在每个组的第一个孩子之前，对孩子进行排序并将他们的家长一起移动。我不能，除非你回答我之前评论中的问题。我修复了一个错误。看见请注意，排序是默认的Javascript排序（区分大小写，大写字母在小写字母之前）。