javascript - 如何切换到引用的类名

Question

我正在尝试用 JavaScript 切换一个类。由此

class=product neutral //background color is grey

对此

class=product correct //background color is green

if (trueProduct == 12){
        document.getElementById("userAnswer").innerHTML = "class='product correct'";    
        }

HTML

<span id="userAnswer" class="product neutral"></span>

Answer 1

使用classList API，这里最方便。

var answer = document.getElementById("userAnswer");
answer.classList.remove("neutral");
answer.classList.add("correct");

classList允许您在不更改任何其他类的情况下切换或添加或删除特定类。

Answer 2

尝试这个，

如果要更改可以使用的所有类名，

document.getElementById("userAnswer").className = "product correct";

如果你只想添加另一个类，你可以使用这个，

document.getElementById("userAnswer").className += " correct";

在此处阅读有关.className的信息

Answer 3

您不想更改innerHTML（在您的情况下为空字符串） …>，</span>但className属性：

document.getElementById("userAnswer").className = "product correct";

或者，您可以使用setAttribute：

document.getElementById("userAnswer").setAttribute("class", "product correct");

Answer 4

element.innerHTML是元素的实际内容，您要查找的是：

if (trueProduct == 12) {
    document.getElementById("userAnswer").className = "product correct";    
}