首页 新闻 会员 周边 捐助

div在js中根据id重新排序咋写？

1
[已解决问题] 解决于 2017-05-17 15:01
复制代码
<div>
<div id="2">海面倒映着美丽的白塔，四周环绕着绿树红墙。<div>
<div id="1">小船儿轻轻，飘荡在水中<div>
<div id="5">让我们荡起双桨，小船儿推开波浪。<div>
<div id="3">红领巾迎着太阳，阳光洒在海面上，<div>
<div id="4">迎面吹来了凉爽的风。<div>
<div>
复制代码

这是一进去的代码，当然我只是示例，这只是一个大的<div>中包裹了这5条,还有很多大div的。

然后我们现在得到一串数组。

var list=[5,2,1,4,3];

这个是对应id，然后要让这5个div按照这个代码重新排序，怎么写啊？

你猜丶的主页 你猜丶 | 初学一级 | 园豆：135
提问于：2017-05-12 17:23
< >
分享
最佳答案
1

html部分

<div id="divs">
  <div id="2">2海面倒映着美丽的白塔，四周环绕着绿树红墙。</div>
  <div id="1">1小船儿轻轻，飘荡在水中</div>
  <div id="5">5让我们荡起双桨，小船儿推开波浪。</div>
  <div id="3">3红领巾迎着太阳，阳光洒在海面上，</div>
  <div id="4">4迎面吹来了凉爽的风。</div>
</div>

js部分

$(document).ready(function(){
    var list=[5,2,1,4,3];
    var divs = $("#divs div");
    var divhtml = '';
    for(var a=0;a<list.length;a++){
      for(var b=0;b<divs.length;b++){
        if(list[a]==$(divs[b]).attr("id")){
          divhtml += divs[b].outerHTML;
        }
      }
    }
    $("#divs").html("").append(divhtml);
  });

我也是新手  不知道能不能帮上你的忙   其他人有什么建议的也可以提出来优化哈

 

奖励园豆：5
笨蛋→说你呢 | 初学一级 |园豆：126 | 2017-05-12 18:11
其他回答(3)
0 
<div id="main"></div>
var contentArray=['1小船儿轻轻，飘荡在水中','2海面倒映着美丽的白塔，四周环绕着绿树红墙。','3红领巾迎着太阳，阳光洒在海面上，','4迎面吹来了凉爽的风。','5让我们荡起双桨，小船儿推开波浪。'];
var indexArray=[5,2,1,4,3];
var html='';
for(var i=0;i<indexArray.length;i++){
　　var index=indexArray[i]-1;
　　var content=contentArray[index];
　　html+='<div>'+content+'</div>'
}
$('#main').html(html);
liuxb1991 | 园豆：661 (小虾三级) | 2017-05-12 22:42
0 
        var list = [5, 2, 1, 4, 3];
        var parent = document.getElementById('divs')
        sortChildren(parent, list);

        function sortChildren(parent, indexs) {
            var nodesWithIndex = [];
            Array.from(parent.children).forEach(function(e) {
                var index = indexs.indexOf(parseInt(e.getAttribute('id')));
                nodesWithIndex.push({
                    index: index,
                    node: e
                });
            });
            nodesWithIndex.sort(function(a, b) {
                return a.index - b.index;
            });
            parent.innerHTML = '';
            nodesWithIndex.forEach(function(e) {
                parent.appendChild(e.node);
            });
        }
行乎当行 | 园豆：347 (菜鸟二级) | 2017-05-13 18:40
0

用片段，根据数组id顺序查 div，然后插入片段，排完再将片段整体添加到父div中

名字不好起啊 | 园豆：401 (菜鸟二级) | 2017-05-16 10:41
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。