首页 新闻 赞助 找找看

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按照这个代码重新排序,怎么写啊?

你猜丶的主页 你猜丶 | 初学一级 | 园豆:183
提问于: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
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册