Question

$(document).ready(function(){
     *POPULATE PAGE WITH DIVS*
});

我发现了一个与我非常相似的问题，有人回答说只是在html中粘贴了大量的div，但我不想这样做。

<body>
    <div class="container">
        <div class="square"></div>
    </div>
</body>

那是我的HTML，我想用javascript / jQuery添加class square的div，直到页面被填满。

有些事情：

for(i=0; i<100; i++)
{
    $('.container').add('.square');
}

我似乎无法正确使用语法。谢谢！

Answer 1

试试这个：

for(i=0; i<100; i++)
{
    $('.container').add('div').addClass('square');
}

Answer 2

试试这个：

for(i=0; i<100; i++)
{
    if(i % 5 == 0)           
       $('.container').append('<div class="square" />').css({clear: 'both'});
    else
       $('.container').append('<div class="square" />');
}

将5更改为您想要的任何内容：）

Answer 3

对于一些变化，您可以构造元素字符串并一次性添加它们，而不是逐个添加它们，如下所示：

var result = "";
var format = "<div class='square'></div>";
for(i = 0; i < n; i++) {
  result += format;
}
$('.container').append(result);

Answer 4

或者

for(var i=0; i<100; i++){
    $("<div/>").addClass("square").appendTo($(".container").eq(0));
}

如何使用javascript和/或jQuery <div>填充整个页面？</div>

4 个答案: