Question

我有一个<div>我克隆（复制），并且我已经将它设置在一个循环中，以便复制到特定限制。

循环不起作用，我的循环有什么问题吗？

这是我的 JSFiddle

Answer 1

您必须将var clone = original.cloneNode(true);放入while循环中。

结果如下：

＆＃13;

document.getElementById('button').onclick = duplicate;
var i = 0;
var counter4 = 3;
var original = document.getElementById('duplicate');

function duplicate() {
    while (i < counter4){
        var clone = original.cloneNode(true); // "deep" clone
        console.log(clone)
        clone.id = "duplicate"; // there can only be one element with an ID
        original.parentNode.appendChild(clone);
        i++;
    }	    	
}

＆＃13;

#duplicate{
    width: 100px;
    height: 50px;
    margin-bottom: 10px;
    background-color: red;
}

＆＃13;

<input type="button" id="button" value="Button">
    <div id="duplicate">
    </div>

＆＃13;

Answer 2

您将var clone = original.cloneNode(true);留在while循环之外，这意味着每次按下按钮时都只会克隆一次。如果要将它克隆三次，则需要将该语句移动到while循环内。

http://jsfiddle.net/3L05as1n/9/

此外，您可以使用for循环来执行此操作：http://jsfiddle.net/3L05as1n/10/

Javascript克隆和循环问题

2 个答案: