Jquery - 按 z-index 从低到高列出 div 中的每个 children

Question

我想列出 jQuery 中 DIV 中的所有 children。但我需要 z-index 订购这个 children。从低到高。

jsFiddle Example

HTML

<div class="container">
    <div style="z-index: 1; ">1b</div>
    <div style="z-index: 10;">10</div>
    <div style="z-index: 3;">3a</div>
    <div style="z-index: 5;">5b</div>
    <div style="z-index: 7;">7</div>
    <div style="z-index: 2;">2</div>
    <div style="z-index: 3;">3b</div>
    <div style="z-index: 5;">5a</div>
    <div style="z-index: 1;">1a</div>
</div>

jQuery

$('.container').children().each(function () {
    alert( $(this).css('z-index') );
});

我需要得到像这样的有序输出：

1b
1a
2
3a
3b
5b
5a
7
10

Answer 1

您可以使用：

function sort_li(a, b){
  return (parseInt(a.style.zIndex,10)) > (parseInt(b.style.zIndex,10)) 
}

$(".container div").sort(sort_li).appendTo('.container');

Working Demo