javascript - For循环if语句困惑

Question

我有一个 JavaScript 对象文字数组，我正在尝试创建一个简单的 for 循环来提取所有信息。问题是，当连续超过 4 本书时，我尝试使用 If 语句关闭并重新打开 div。但是，当图书数量超过 4 本书时，它会将这些 div 添加到图书对象的每个实例中，为每个项目创建一行。我只是无法想出正确的条件是什么，只会每 4 本书关闭一次重新打开 div。

    var bookInfo = '';
    var book;


   function print(bookInfo) {
     var outputDiv = document.getElementById('books-go-here');
     outputDiv.innerHTML = bookInfo;
   }

    for(var i = 0; i < books.length; i += 1){
     book = books[i];
     bookInfo += '<div class="large-3 small-6 columns output">';
     bookInfo += '<img src="' + book.image + '"/>';
     bookInfo += '<div class="panel">';
     bookInfo += '<h2>' + book.name + '</h2>';
     bookInfo += '<p>' + book.description + '</p>';
     bookInfo += '</div>';
     bookInfo += '</div>';
     // return bookInfo;
      if (books.length > 4) {
         bookInfo += '</div>"';
         bookInfo += '</div>"';
         bookInfo += '</div>"';
         bookInfo += '<div class="row">';
         bookInfo += '<div class="large-12 columns">';
         bookInfo += '<div id="books-go-here" class="row">';
       }

     }
   print(bookInfo);

非常感谢任何帮助，因为这确实让我的大脑感到痛苦。

Answer 1

如果您想在每 4 本书之后添加额外的 HTML，则应该是:

if (i > 0 && i % 4 == 0)

i % 4计算 i/4 的余数，所以是0当i是 0 , 4 , 8等 i > 0测试防止它在第一本书之前关闭。

您还应该将此代码放在 for 的开头处。循环，而不是结束。由于计数从 0 开始，打印 4 本书后，下一次迭代将有 i = 4 .

此外，循环完成后，您需要关闭最后一行。那应该检查if (books.length > 0) (如果有 0 本书，则循环不会创建任何行，因此无需关闭任何内容)。