根据类名对表行进行排序

Question

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

<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秒..等等.

请有人帮助我

Answer 1

如果您不想依赖外部插件,可以使用match()从类名中提取数字,并使用内置的sort()方法对元素进行排序.

从那里,您可以使用append()重新排序表行(它将从表中删除每一行,然后在适当的位置重新添加它):

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

你可以在这个小提琴中看到结果.