2012-04-10 42 views
8

我有3个div的想扭转准备上doucment顺序jQuery的重新排序的div

<div id="block-1">First</div> 
<div id="block-2">Second</div> 
<div id="block-3">Third</div> 

我怎么能做到这一点jQuery的?

+3

为什么你想要在文档准备好时将它们反转?为什么不最初加载它们呢? – 2012-04-10 12:11:50

回答

3

这将扭转ID为 “DIV1”

$(function(){ 
    var items=$("#div1 div").toArray(); 
     items.reverse(); 
     $.each(items,function(){ 
      $("#div1").append(this); 
     });  
    });​ 

这里一个div里面所有div是的jsfiddle http://jsfiddle.net/bCAVz/8/

+0

我喜欢使用toArray() - 除了被要求提供的通用reverse()之外,我还可以使用它来随机化等。 – 2017-08-12 11:28:30

19
<div id="parent"> 
<div id="block-1">First</div> 
<div id="block-2">Second</div> 
<div id="block-3">Third</div> 
</div> 

而且试试这个jQuery中

$('#parent > div').each(function() { 
    $(this).prependTo(this.parentNode); 
});​ 

你可以看到的jsfiddle http://jsfiddle.net/N7PGW/

+2

+1不依赖于知道父代中div的id或数目。 – 2012-04-10 12:18:12

0
$(
    $("div[id|=block]") 
     .slice(1) 
     .get() 
     .reverse() 
) 
    .insertBefore("div[id|=block]:first"); 

http://jsfiddle.net/8adwS/

例如另外请注意,您可以添加阵列反向语法jQuery函数语法,会为你节省一个选择器。