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)

演示：Fiddle

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元素，使用array .sort() method将它们按照自己的viewers元素的id属性的顺序排列（我假设只有数字ID在这里 - 对于字母排序，你显然不能只减去id，然后使用.append()在父级中移动它们。我当然假设他们有一个共同的父母。

按子div的ID排序div

2 个答案: