Question

<button id="mybtn">click me for index </button>

我的JavaScript代码：

var myarray = [2,4,6,5,5];

(i=0; i<= myarray.length; i++){

   var allBtn = document.getElementByID("mybtn");

   document.body.appendChild(allBtn);
}

我想制作多个按钮，所以我用循环来创建它们。但它没有用。

以下是网址：http://jsbin.com/donafuluha/1/edit?html,js,console,output

Answer 1

您可以使用cloneNode来附加现有元素

Working Demo

代码：

var myarray = [2,4,6,5,5];


for(var i=0; i< myarray.length; i++){

  var allBtn = document.getElementById("mybtn").cloneNode(true);

  document.body.appendChild(allBtn);

}

Answer 2

你可以使用cloneNode（）来复制它并附加多个。我还建议您从DOM中删除节点，并仅在屏幕上显示克隆。看着你的阵列似乎也想要附加一些数据。这可以通过分配属性或使用 .setAttribute（“name”，value）

来完成

var myarray = [2,4,6,5,5];
var proto = document.getElementById("mybtn");
proto.parentElement.removeChild(proto);

for(var i=0; i<myarray.length; i++){
    var allBtn = proto.cloneNode(true);
    allBtn.setAttribute("data-index", myarray[i]);
    document.body.appendChild(allBtn);
}

Answer 3

You should try following code snippet it will solve your problem 
    var myarray = [2,4,6,5,5];
    for(var i=0; i<= myarray.length; i++){
        var btn = document.createElement("BUTTON");
        var t = document.createTextNode("New Button"+(i+1));
        btn.appendChild(t);
        document.body.appendChild(btn);
      }

document.getElementByID和for循环

3 个答案: