根据类别名称对表格行进行排序 [英] Sort table rows based on their Class Names

问题描述

我想根据其类名重新排列表行.
下面是我的HTML代码.

I want to rearrange table rows based on their Class names.
Below is my HTML code.

<table>
 <tr class="a4"><td>4</td></tr>
 <tr class="a6"><td>6</td></tr>
 <tr class="a1"><td>1</td></tr>
 <tr class="a2"><td>2</td></tr>
 <tr class="a5"><td>5</td></tr>
 <tr class="a3"><td>3</td></tr>
</table>

因此，现在，类名为a1的应该显示第一，同样地，第二个为a2等等.

So now, with class name a1 should display first, likewise a2 second.. etc..

请有人帮助我

推荐答案

如果您不想依赖外部插件，则可以使用

If you don't want to rely on an external plugin, you can extract the numbers from the class names using match() and sort the elements using the built-in sort() method.

从那里，您可以使用 append()对表行进行重新排序(它将删除各行)表格中的一行，然后将其重新添加到适当的位置):

From there, you can use append() to reorder the table rows (it will remove each row from the table then re-add it at the proper position):

$("table").append($("tr").get().sort(function(a, b) {
    return parseInt($(a).attr("class").match(/\d+/), 10)
         - parseInt($(b).attr("class").match(/\d+/), 10);
}));

您可以在此小提琴中看到结果.

这篇关于根据类别名称对表格行进行排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！