Javascript 将for循环中的三个元素包装到div中

我写了这个方法：

var printWords = function(){
    for(i = 0; i < words.length; i++){
        block = document.createElement("blockquote");

        p = document.createElement("p");
        p.innerHTML = words[i]["word"];

        small = document.createElement("small")
        small.innerHTML = words[i]["translation"];
         
        block.appendChild(p);
        block.appendChild(small);
         
        document.getElementById('siteContent').appendChild(block);
    } 
}

---

或许可以尝试以下方式：

<blockquote>
    <p>to great somebody</p>
    <small>jemanden grüßen</small>
</blockquote>

var printWords = function(){
    var row, block, p, small;
    for(i = 0; i < words.length; i++){
        if ((i % 3) == 0) {
            row = document.createElement("div");
            row.setAttribute("class", "row");
            document.getElementById('siteContent').appendChild(row);
        }

        block = document.createElement("blockquote");

        p = document.createElement("p");
        p.innerHTML = words[i]["word"];

        small = document.createElement("small")
        small.innerHTML = words[i]["translation"];

        block.appendChild(p);
        block.appendChild(small);

        row.appendChild(block);
    } 
}

var printWords=function（）{
var行、块、p、小；
对于（i=0；i

---

注意：-在通过上述回复理解主要问题后，我已编辑了此答案。

var printWords = function(){
        var divTag = document.createElement('div');
          divTag.className = "row"; 
        for(i = 1; i <= words.length; i++){
            block = document.createElement("blockquote");

            p = document.createElement("p");
            p.innerHTML = words[i]["word"];

            small = document.createElement("small")
            small.innerHTML = words[i]["translation"];

            block.appendChild(p);
            block.appendChild(small);
            divTag.appendChild(block);

            if((i % 3) == 0){
                document.getElementById('siteContent').appendChild(divTag); 
                divTag = document.createElement('div');
                divTag.className = "row";   
            }
        }
    }

var printWords=function（）{
var divTag=document.createElement（'div'）；
divTag.className=“行”；
对于（i=1；i
divblock=document.createElement（“blockquote”）；
setAttribute（“类”、“行”）；
var printWords=函数（）{
对于（i=0；i
我只想在I%3上添加一个条件。类似这样：

var printWords = function(){
    div = document.createElement("div") //create a div to start

    for(i = 0; i < words.length; i++){
        block = document.createElement("blockquote");

        p = document.createElement("p");
        p.innerHTML = words[i]["word"];

        small = document.createElement("small")
        small.innerHTML = words[i]["translation"];

        block.appendChild(p);
        block.appendChild(small);

        div.appendChild(block);

        //run this each third loop or the last time through the loop
        if((i+1)%3 === 0 || i === words.length-1){  

          //Append your div to siteContent;
          document.getElementById('siteContent').appendChild(div);  

          //reset your div
          div = document.createElement("div"); 
        }
    }

}

var printWords=function（）{
div=document.createElement（“div”）//创建一个div开始
对于（i=0；i
但我总是希望在div上的类行中有三个块引号！但是谢谢您的帮助help@JohnSmith这就是它的作用。每三分之一的
blockquote
被分组到一个新的
div.row
。对不起，我想你没有理解我，我希望最后它看起来像这样：
！谢谢你的帮助！@JohnSmith是的，这正是它所做的（除了它产生
..
而不是
..
，但我想这就是你的意思）。查看我的更新答案以进行演示。查看所有全局变量。使用
var
divblock = document.createElement("blockquote");
divblock.setAttribute("class", "row");
var printWords = function() {
    for(i = 0; i < words.length; i++) {

        block = document.createElement("blockquote");

        p = document.createElement("p");
        p.innerHTML = words[i]["word"];

        small = document.createElement("small")
        small.innerHTML = words[i]["translation"];

        block.appendChild(p);
        block.appendChild(small);

        //Add block to the div
        divblock.appendChild(block);

        if ( (i%3) == 2) {
            //Render the previous div
            document.getElementById('siteContent').appendChild(divblock);
            //Create a new div block
            divblock = document.createElement("div");
            divblock.setAttribute("class", "row");
        }
    } 
}

var printWords = function(){
    div = document.createElement("div") //create a div to start

    for(i = 0; i < words.length; i++){
        block = document.createElement("blockquote");

        p = document.createElement("p");
        p.innerHTML = words[i]["word"];

        small = document.createElement("small")
        small.innerHTML = words[i]["translation"];

        block.appendChild(p);
        block.appendChild(small);

        div.appendChild(block);

        //run this each third loop or the last time through the loop
        if((i+1)%3 === 0 || i === words.length-1){  

          //Append your div to siteContent;
          document.getElementById('siteContent').appendChild(div);  

          //reset your div
          div = document.createElement("div"); 
        }
    }

}