如何停止innerHtml在表格中一遍又一遍地重复自己？

Question

我已经创建了一个数组，其中包含从三个不同的用户变量获取信息的对象，但是在其中一个上有许多子变量，我不希望它在每次用户按下选择按钮时重复自身（更新表格）而不是我希望它只是添加到（或删除）它已经在表格中的部分。谢谢（如果您需要可变代码，请告诉我）我已经尝试解决这个问题一段时间了！请帮忙！！

//creating array
var gProducts = new Array();
var gTotalCost = 0;



// Adding Products to array gProducts
    function addProduct
{
var product = new Object();
product.name = name;
product.cost = cost;
gProducts.push(product);
gTotalCost += parseInt(cost)
}


 //Getting products from array, use of for in loop setting new table rows in blank var for each array item
function renderProducts()
{
var HTMLadd = ""

for (var i in gProducts)
{
if( gProducts[i].cost > 0){
    HTMLadd = HTMLadd + 
    "<tr>"+ 
    "<td class='tableSettings00' id=tableRow2 >" + gProducts[i].name +
    "</td>"+
    "<td class='tableSettings'>€<span id=tableRow2part2>" + gProducts[i].cost +
    "</span></td>"+ 
    "</tr>";
    }
    else 
    {
    }
}
document.getElementById('tableRow').innerHTML = HTMLadd;

}

Answer 1

您正在使用 for in 循环，而您可能只需要一个 for 循环。

将此行改为

for (var i in gProducts)

到

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

使用 for/in 循环，变量 i 将是一个对象，而不是一个整数。