javascript - 一次输出一个数组元素

Question

目前，我将表单数据(单个文本字段)推送到一个空数组，以便每次单击“提交”时，数据都会推送到数组的末尾(因此，数组会变得更大)

我正在经历什么: 我想输出表中的每个元素，但我想每行一个元素，但现在每行输出如下

第一行:输入数据并按一次提交 -> EnteredData

第二行:输入更多数据并按下 -> EnteredData 输入数据1

如果我输入另一个元素，它就会 输入的数据 输入数据1 输入数据2 等等等等......

这是我循环的代码块: userInputName.push(userString);

for (arrayIndex = 0; arrayIndex < userInputName.length; arrayIndex++) {    
    output.innerHTML += "<tr><td>" + userInputName[arrayIndex] + "</td></tr>";

}

我觉得我在 for 循环中缺少某种条件逻辑，但此刻( sleep 太少)我无法理性地将其拼凑在一起:|

对我缺少的东西有什么建议吗？

这就是我的完整 JavaScript 代码块的样子 - 我可以将其引用到我的其他线程询问相关问题:

//Declare global variable
var userInputName       = [];
function displayTableAndTotals() {
// Your code goes in here.
//var totalStrings      = [];
var userString;
var arrayIndex;
var output;
var outputTotal;
var form;

form                = document.getElementById("userFormId");
output              = document.getElementById("userEntriesId");
outputTotal         = document.getElementById("testId");
userString          = form.string.value;

userInputName.push(userString);

for (arrayIndex = 0; arrayIndex < userInputName.length; arrayIndex++) {    
    output.innerHTML += "<tr><td>" + userInputName[arrayIndex] + "</td></tr>";

}

form.string.select();
return false;   
}

Answer 1

您可以只添加推送的元素

var table = document.querySelector('#myTable');

document.querySelector('[type="submit"]').addEventListener('click', function(e) {
    table.innerHTML += "<tr><td>" + userInputName.reverse()[0] + "</td></tr>";
}, false);