div排序问题

最新推荐文章于 2021-07-15 15:40:23 发布

darling5679

最新推荐文章于 2021-07-15 15:40:23 发布

阅读量166

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/nlyangtong/p/10819229.html

版权

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <title></title>
 5     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
 6     <script type="text/javascript">
 7         $(function () {
 8             var divTestJQ = $("#divTest"); //取得容器对象
 9             var divJQ = $(">div.test", divTestJQ); //取容器需要重排的对象
10             var EntityList = []; //定义一个数组用于存放要排序的对象
11             divJQ.each(function () {
12                 var thisJQ = $(this);
13                 EntityList.push({ Name: parseInt(thisJQ.attr("name"), 10), JQ: thisJQ }); //把要排序的对象和排序的值一起放到一个新的对象里，并存入到数组
14             });
15             EntityList.sort(function (a, b) { //利用数组的排序方法重新排序对象
16                 return b.Name - a.Name; //从大到小
17                 //return a.Name - b.Name; //从小到大
18             });
19             for (var i = 0; i < EntityList.length; i++) {
20                 EntityList[i].JQ.appendTo(divTestJQ); //把排序完的对象重新插入到容器对象
21             };
22         });
23     </script>
24 </head>
25 <body>
26     <div id="divTest">
27         <div class="test" name='1'>
28             <div class="test">
29                 a</div>
30             //嵌套的div没有name属性
31         </div>
32         <div class="test" name='2'>
33             b</div>
34         <div class="test" name='3'>
35             c</div>
36         <div class="test" name='5'>
37             d</div>
38         <div class="test" name='7'>
39             e</div>
40         <div class="test" name='4'>
41             f</div>
42         <div class="test" name='8'>
43             g</div>
44     </div>
45 </body>
46 </html>