jquery - 如何使用 jQuery 创建 250 个 div？

Question

我想制作一个包含 250 个 div 的网站，其中包含相应的数字。我可以键入所有这些，但我知道我可以在 jQuery 中使用 for 循环。不过，我不确定如何去做。任何帮助将不胜感激。谢谢！

Answer 1

var container = document.getElementById('foo');
for (var i = 0; i < 250; i++){
  var d = document.createElement('div'); // <div>
  d.id = 'div' + i;                      // id="div{i}"
  d.className = 'someclass';             // class="someclass"
  container.appendChild(d);
}

或者，就 jQuery 而言：

for (var i = 0; i < 250; i++){
  $('<div>',{           // <div>
    'id':'div'+i        // id="div{i}"
    'class':'someclass' // class="someclass"
  }).appendTo('#foo');
}

Answer 2

尝试这样的事情。您需要替换为包含 div 的名称，以及为它们提供通用样式的类的名称。

var c = $("#<container-name>");

for (var i = 1; i < 251; i++) {
  $("<div></div>").addClass("<class-name>").text(i).appendTo(c);
}

Answer 3

这可能有点难看，但使用一次附加将优于多次使用它。

var html = '';

for (var i = 0; i < 250; i++) {
  html += '<div id="div' + i + '">' + i + '</div>';
}

$('#example').append(html);