jQuery使用'for'来复制div

Question

我想创建一些div,以便填充当前窗口大小.到目前为止,我已经做到了一次,但不能重复这一点.我把它们放在另一个div中,所以当包含div到达窗口的高度时,它就会停止制作它们.

$(document).ready(function() {
    var winHeight = $(window).height(),
        divHeight = $('div.container').height(),
        html = $('<div class="line"></div>');

    for (i = 1, l = 10; i < l; i++) {
        $('div.container').append(html); }

如何用i和l代替变量winHeight和divHeight？非常感谢.

Answer 1

不要创建htmljQuery对象,只需创建html模板

html = '<div class="line"></div>';

另外,它就像你试图在循环中追加相同的元素,另一种解决方案是使用 clone()

html = $('<div class="line"></div>');

然后

$('div.container').append(html.clone());

Answer 2

假设所有线都有相同的高度(让我知道),你可以这样:

var html, winHeight, lineHeight, howManyLines;
html = '<div class="line"></div>';
winHeight = $(window).height();
// appends one line in order to retrieve its actual height
lineHeight = $(html).appendTo('div.container').height();
// calculates the required number of lines to fill the window
howManyLines = Math.floor(winHeight / lineHeight);
// appends missing lines
$('div.container').append(
    new Array(howManyLines).join(html)
);