按属性排序jQuery结果？

Question

是否可以按属性的值对jQuery结果进行排序？例如,请考虑以下代码段和结果:

$('span').each(function()
{
    $('#log').append($(this).attr('name'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<span name="a5"></span>
<span name="a3"></span>
<span name="a6"></span>
<span name="a1"></span>
<span name="a4"></span>

<div id="log"></div>

在不修改HTML或DOM的情况下,如何最好地修改此代码以获得排序结果,即.a1a3a4a5a6？虽然我显然可以将每个结果都放在一个数组中然后对它进行排序,但我假设使用jQuery的原生能力有更优雅的方式.在那儿？

Answer 1

您不需要构建中间数组,为方便起见,jQuery公开了Array.prototype.sort方法:

$.fn.sort = Array.prototype.sort;

而且因为它Array.prototype.sort;是通用的⁽*^),它只是神奇地适用于jQuery集合.

$('span')
.sort(function(a, b) { 
    return $(a).attr('name').localeCompare($(b).attr('name')); 
})
.each(function() {
    $('#log').append($(this).attr('name'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<span name="a5"></span>
<span name="a3"></span>
<span name="a6"></span>
<span name="a1"></span>
<span name="a4"></span>

<div id="log"></div>

_{*原型方法上下文中的泛型意味着方法内部实现并不关心this实例是一个真实Array实例,只要它是一个类似数组的集合.}