javascript - jQuery 按标签重新排序元素

Question

我目前正在尝试通过rel="1234"与每个使用 jQuery 关联的标签重新排序元素的无序列表。

但是，我当前的代码导致输出不出现，我无法弄清楚原因。任何人都可以帮忙吗？

我的 jQuery 代码是：

$(function(){
    var elems = $('#test').children('li').remove();
    elems.sort(function(a,b){
        return parseInt(a.attr('rel')) > parseInt(b.attr('rel'));
    });
    $('#test').append(elems);
});

使用这样的基本标记：

<ul id="test">
    <li rel="4112">blub</li>
    <li rel="1422">blaaah</li>
    <li rel="6640">hmmmm</li>
    <li rel="2221">one more</li>
</ul>

http://jsfiddle.net/BQZHC/

Answer 1

试试这个：-

$(function(){
    var elems = $('#test').children('li'); // You dont need to remove the elements
    elems.sort(function(a,b){
         return +$(a).attr('rel') > +$(b).attr('rel'); // use attr on jquery object i.e $(a), $(b)
    });
    $('#test').append(elems); // This will take care of repositioning the elements.
});

演示

Answer 2

这就是你想要的

JS：

var elems = $('#test').children('li').remove();
elems.sort(function(a,b){
    return parseInt($(a).attr('rel'), 10) > parseInt($(b).attr('rel'), 10);
});
$('#test').html(elems);

请注意，排序函数的“a”和“b”元素应该被视为 jQuery 对象。您还应该指定的基数parseInt()

演示：http: //jsfiddle.net/BQZHC/10/

Answer 3

a并且b是 DOM 元素，而不是 jQuery 对象。

要么将它们包装$()成 jQuery 对象，要么getAttribute("rel")使用.attr("rel"). 它有点长，但需要更少的开销。

---

此外，假设您想要数字排序，我会使用减法。

return a.getAttribute("rel") - b.getAttribute("rel");

过去曾有浏览器在返回布尔值时遇到问题。