在Javascript中為循環中生成的每個值創建一個按鈕

Question

我有來自后端的數據，我必須為那時生成的每個值創建一個按鈕

這是一個網頁，它應該顯示每個值的按鈕，即values[i].good and values[i].bad

for (i in values){
  msg += values[i].good + ' - ' + values[i].end+ '<br>';
  $('<button type>',{text:values[i].good + ' - ' + values[i].bad,id : 'btn_'+ i});
}

例如，如果我的數據是（12-13,13-14），如果values[i].good是12，而values[i].bad是13，那么我需要一個按鈕（12-13），同樣的事情應該重復所有值。 所有按鈕應顯示在Web應用程序中。

Answer 1

您可以使用

var button = document.createElement("button");
button.setAttribute("id", 'btn_' + i);

然后放進去

var btn_text = document.createTextNode(values[i].good + ' - ' + values[i].bad);
button.appendChild(btn_text);

之后，將此添加到元素

var element = document.getElementById("div1") //If have wraper
//OR
var element = document.body // If no

//Then Apply
element.appendChild(button);

像這樣的代碼

 var values = [{ good: 13, bad: 14 }, { good: 14, bad: 15 }, { good: 16, bad: 17 }]; //element = document.getElementById("div1") //If have wraper var element = document.body for (var i in values) { var para = document.createElement("button"); var node = document.createTextNode(values[i].good + ' - ' + values[i].bad); para.setAttribute("id", 'btn_' + i); para.appendChild(node); element.appendChild(para); }