jquery - 我如何根据这些元素的子元素中的数字从最高到最低重新排列 HTML 元素？

Question

我有一组由我的网页生成的信息。

HTML:

<div class="num1"><div>1000</div> Some other stuff like more elements </div>
<div class="num1"><div>200</div> Some other stuff like more elements </div>
<div class="num1"><div>400</div> Some other stuff like more elements </div>
<div class="num1"><div>500</div> Some other stuff like more elements </div>
<div class="num1"><div>12000</div> Some other stuff like more elements </div>

我想根据元素内部的数字从高到低排列这些 div 元素。

我希望能够使用 jquery 或某些库来操纵 div，以按照数字从最高到最低的顺序排列，而不是按显示的顺序排列。 第一个 12000 个，最后一个 200 个，同时保持父 DIVS 中的所有 html 完好无损。

感谢您的任何回复。

Answer 1

你可以对它们进行排序

$('.num1').sort(function(a,b) {
    return $(b).find('div').eq(0).text() - $(a).find('div').eq(0).text();
}).appendTo( $('.num1').parent() )

FIDDLE