配列値をリストアイテムに追加する

Question

リストに項目の配列を出力しようとしています。問題は、提出ボタンをクリックすると、毎回1つではなく各リスト項目にすべての配列項目が追加されることです。

JSFIDDLE： https://jsfiddle.net/b7Lwbrof/

ありがとう！

var itemList = []; 
var container = document.getElementById('container'); 

// On click 
document.getElementById('submit').addEventListener("click", function(){ 
    var itemValue = document.getElementById('itemValue').value; 

    // Push to array 
    itemList.push(itemValue); 

    // Append to List 
    for(i=0; i<itemList.length; i++) { 
     var items = document.createElement("li"); 
     document.getElementById('container').appendChild(items); 
     items.innerHTML = itemList[i]; 
    } 
}) 

Answer 1

ループは必要ありません。アイテムをitemListにプッシュした後に追加するだけです。

document.getElementById('submit').addEventListener("click", function(){ 
    var itemValue = document.getElementById('itemValue').value; 

    // Push to array 
    itemList.push(itemValue); 

    // Append to List 
    var items = document.createElement("li"); 
    document.getElementById('container').appendChild(items); 
    items.innerHTML = itemList[itemList.length-1]; 
}) 

Answer 2

items.innerHTML = itemList[itemList.length - 1] // get the last 

とNOT

items.innerHTML = itemList[i] 

---

そして@digitが言ったようにループを削除します。あなたはリストに最後の項目を追加、またはリスト全体を書き換える可能性のいずれか

フィドルhere