通过子div的ID对div排序

Question

我有一个文件，该文件以递归方式多次响应以下HTML（例如3次）；

<div class="container" style="float:left;">
    <div class="img"><img/></div>
    <div class="info">
        <p class="title">...</p>
        <p class="name">...<p>
        <p class="viewers" id="2042">2042</p>
        <p class="data">...</p> 
    </div>
</div>

我想根据.viewers标记的ID来订购这些主要的.container div（如您所见，它已设置为复制实际的观看者人数）。

有人可以帮我吗？

Answer 1

如果所有这些元素都在一个容器元素下，则

var els = $('#myct > .container').get();

els.sort(function (o1, o2) {
    return $.trim($(o1).find('.viewers').text()).localeCompare($.trim($(o2).find('.viewers').text()))
});

$('#myct').append(els)

演示： 小提琴

Answer 2

这似乎工作正常：

var $divs = $(".container");

[].sort.call($divs, function(a, b) {
    return $(a).find(".viewers").attr("id") -
           $(b).find(".viewers").attr("id");
});

$divs.parent().append($divs);

演示： http ： //jsfiddle.net/pZLY6/

也就是说，选择所有container元素，使用数组.sort()方法将它们按其自己的viewers元素的id属性的顺序放置（我在这里仅假设数字ID-对于字母排序，您显然无法做到）只需减去ID），然后使用.append()在其父级中移动它们。 我当然假设他们有一个共同的父母。