Question

我想创建10个Div-Containers，其中包含10个Div元素。因此我使用jquery在TypeScript中编写了以下代码：

  for (var i = 0; i < 10; i++) {
        var outsidediv = $('<div id="outsidediv"></div>').appendTo('body')
        for (var j = 0; j < 10; j++) {
        }
        var innerdiv = $('<div class="innerdiv"></div>').appendTo('outsidediv');
    }
})

但它所做的一切，就是它创造了10个Div容器和一个Div Element，它不在容器内。如果有人可以快速查看这个（通常）简单的问题，我真的很感激。

非常感谢！

Answer 1

通过创建单个HTML字符串并将其附加到正文中，一次性将.innerdiv添加到其容器#outsidediv中。

for (var i = 0; i < 10; i++) {
        var div = '<div id="outsidediv">' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '<div class="innerdiv"></div>' + 
                  '</div>';
         $('body').append(div);
    }
})

Answer 2

我没有仔细研究一下发生了什么事，但是直接向我跳出来的是你的第二个循环没有做任何事情，因为你的内心是＆＃39; innerdiv＆＃39;变量低于它关闭的位置。

  for (var i = 0; i < 10; i++) {
    $('<div id="outsidediv"></div>').appendTo('body');
    for (var j = 0; j < 10; j++) {
       $('<div class="innerdiv"</div>').appendTo('outsidediv');
    }
  }

然而，由于jquery不知道哪个＆＃39; outsidediv＆＃39;追加。你将不得不考虑一种不同的方法。也许只输出你想要的HTML？

var html = '';
for (var i = 0; i < 10; i++) {
  html += '<div id="outsidediv">';
  for (var j = 0; j < 10; j++) {
    html += '<div class="innerdiv"</div>';
  }
  html += '</div>';
}
$(html).appendTo('body');

这不是最短的方式，但它应该做你想要的。

Answer 3

＆＃13;

for (var i = 0; i < 10; i++) {
    var outsidediv = $('<div id="outsidediv' + i +'" class="outsidediv" />').appendTo('body');
    
    for (var j = 0; j < 10; j++) {
      var innerdiv = $('<div class="innerdiv"/>').appendTo('.outsidediv:last-child');
    }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

我想使用jquery（TypeScript）在Div-Containers中创建Div-Elements

3 个答案: