javascript - 如何从表格单元格中清除以前的内容

Question

我正在尝试向我的表中添加一个“清算”函数来计算总计。这样，当人们第一次按下进行计算的按钮，然后更改产品数量，然后再次按下时，先前的答案将被清除并重新添加。

我试过这样的:

function clear () {
    var table = document.getElementById("pricetable");
    var rows = table.getElementsByTagName("tr");

    for (var i = 0; i < rows.length; i++) {
        rows[i].className = "";
        var cells = rows[i].getElementsByTagName("td");

        for (var j = 1; j < cells.length - 1; j++) {
            cells[j].className = "";
        }
    }
}

然后我调用我之前计算金额和价格的函数开头的函数:

function calculate () {
    clear ();
    ... 
}

但是没有任何反应。我在想这可能与我动态创建了最后一行和最后一列(都包括总数)这一事实有关。行的id是lastRow，列没有id。

而且我不想使用 jquery 或将类、id 等添加到 html 文件中。那么有人知道我的代码有什么问题吗？

Answer 1

className 只是清除样式。

您正在寻找 innerHTML:

...
for (var j = 1; j < cells.length - 1; j++) {
    cells[j].innerHTML = "";
}
...

---

className 是指应用于元素的 CSS 类名。这是您当前代码的作用:

之前

<td class='foo'>999</td>

之后

<td class=''>999</td>

---

innerHTML 几乎如其所言:

之前

<td class='foo'>999</td>

之后

<td class='foo'></td>

---

此外，我刚刚注意到您的 for 循环从 1 开始。希望这是故意的 ;)