排序功能包括儿童

时间:2014-08-04 04:23:08

标签: javascript jquery html

我目前有一个函数可以根据类对数字进行排序,但是当它抓取数据时它不会假设孩子。这是功能:

$(document).ready(function () {
  var sortedDivs = $(".frame").find("div").toArray().sort(sorter);
  $.each(sortedDivs, function (index, value) {
    $(".sorted").append(value);
  });
});

function sorter(a, b) {
     return a.getAttribute('class') - b.getAttribute('class');
};

需要这样:

<div class="frame">
<div class="5">
   Div 5 here
   <div class="sub">
        Div 11 here             
   </div>
</div> 
<div class="3"> 
   Div 3 Here 
</div> 
<div class="4.5"> 
   Div 4.5 here 
</div>
<div class="4">
  Div 4 Here
</div>

输出:

<div class="frame"></div>
<div class="sorted">
  <div class="sub">
     Div 11 here             
  </div>
  <div class="3"> 
     Div 3 Here 
  </div>
  <div class="4">
    Div 4 Here
  </div>
  <div class="4.5"> 
    Div 4.5 here 
  </div>
  <div class="5">
    Div 5 here  
  </div>
</div>

我希望脚本也能移动所有孩子(即div,img等),从而在这里放置&#34; Div 11&#34;持续。换句话说,.sub仍然是.5的孩子。

有什么好主意吗? = d

请参阅此处的小提琴:http://jsfiddle.net/Thaikhan/6hpNz/65/

3 个答案:

答案 0 :(得分:2)

尝试将选择器更改为:

var sortedDivs = $(".frame > div").toArray().sort(sorter);

它会占用frame下的所有div。

答案 1 :(得分:1)

将选择器更改为

var sortedDivs = $(".frame>div").toArray().sort(sorter);

Refer updated fiddle

答案 2 :(得分:0)

您从[{1}}获取所有div,因此它还包含.frame。找到div with 11

的孩子
.frame