Question

我想将每3条记录追加到for循环中的一个div。 numberList是动态的，所以我们不确定确切的长度。要求是挑选3条记录并将其包装在div中。例如，如果numberList.length是7，那么我们应该有3个div。前2个div将包含3个记录，最后一个div将有一个记录。

如何解决这个问题？

for (var j = 0; j < numberList.length; j++) {
number = numberList[j].Number;
}

每3条记录后，取结果并附加一个div

Answer 1

你需要这个吗？！

for (var j = 0; j < numberList.length; j++) {  
  if ((j+1)%3) {  
    // create new div
  } else {
    // add record to the div
  }  
}

Answer 2

<html>
<head>
<title>test</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    var arr = ["one", "two", "three", "four", "five", "six", "seven"];
    var j = 0;
    var str = "";
    var master = $("#masterDiv");
    for (i = 0; i < arr.length; i++) {
        str += arr[i];
        j++;
        if (j >= 3) {
            master.append($('<div/>', { html: str }));
            str = "";
            j = 0;
        }
    }
    master.append($('<div/>', { html: str }));

});   
</script>
</head>
<body>
<div id="masterDiv"></div>
</body>
</html>

Answer 3

- 试试这个

var numberList = [10, 20, 30, 80, 50, 60 , 70 ,80,90,100,110,120,130];

var currentRecord = '';
var Num = 0;
var content = '';

for (var j = 0; j < numberList.length; j++) {
    content = '';
    Num = (j + 1);
    if (Num % 3 == 0) {
        currentRecord += numberList[j] + '   ';
        $('#content').append('<div> newDiv '+ currentRecord+'</div>' );
        currentRecord = '';
    }
    else {
        currentRecord += numberList[j] + '   ';
    }

    if ((Num == numberList.length) && (Num % 3 != 0)) {
         $('#content').append('<div>newDiv '+ currentRecord + '</div>' );
    }

}

Answer 4

尝试这样的事情：

var numberList = [ 123, 234, 345, 456, 567, 678, 789 ]; // sample data

var frag = document.createDocumentFragment(),
    div;

for (var j = 0; j < numberList.length; j++) {
    if (!(j % 3)) {
        div = document.createElement('div');
        frag.appendChild(div);
    }
    div.appendChild(document.createTextNode(' ' + numberList[j]));
}

document.body.appendChild(frag);

此处示例：http://jsfiddle.net/vtQtr/

大部分应该看起来很熟悉;如果您不熟悉，可能需要阅读remainder operator %（有时称为“mod”或“modulo”）。

我们还使用文档片段来避免重复修改文档。首先，我们将内容插入到片段中，然后我们立即将整个片段插入到文档中。

在本例中，我将每个div中的数字与一个空格分开，但您可以调整它以使用您喜欢的任何内容。

for循环并将结果集附加到div

4 个答案: