javascript - Javascript innerHTML 忽略文本格式

Question

我在表格单元格中有以下值，带有粗体和颜色格式

单元格 id="total"; 值="你好"

但是当我如下更改单元格的值时，它会忽略文本格式

document.getElementById("total").innerHTML = "Hello"

并导致

Hello (with out bold and color)

Answer 1

那是因为您正在用“Hello”替换现有内容——先前内容的样式是由于内容本身的属性，并且由于该内容已被清除，因此无法保留。

例如，如果您想为新内容设置样式，则需要手动提供

document.getElementById("total").innerHTML = "<strong>Hello</strong>";

Answer 2

我认为更好的解决方案是通过样式表应用您的样式，如下所示：

#total {
    font-weight: bold;
    color: #FF0000; /* Replace this with the right color */
}

现在，

document.getElementById("total").innerHTML = "Hello";

应该允许单元格保持其样式。

Answer 3

是的，最好的方法可能是使用 CSS 样式。