在活动班级中使用空格

Question

我昨天得到了一个项目，昨天有一个包含以下代码的项目：

document.getElementById("test").className += " active"

起初我无法让它工作，因为我没有在＆＃34;之前添加空白空间。活性＆＃34;部分。一旦我添加它，代码工作正常。

你为什么需要这样做？这是JS的事吗？

Answer 1

因为类属性上的许多类用空格分隔，所以需要添加空格，因为元素上已经有一个或多个类。例如，如果没有空间，您将拥有：

class="fooactive" // A single class "fooactive" that doesn't exist

因为它将连接两个值而不是将它们作为两个单独的类读取。因此，您需要添加一个空格，以便class属性将它们作为单独的类读取：

class="foo active" // Two classes "foo" and "active"

Answer 2

斯宾塞的答案已经解释了空间背后的原因。我只是想说明，使用classList可以简化读写类名。例如，只需使用以下代码添加类：

devlove.yaml

要删除它，请执行：

document.getElementById("test").classList.add("active");

另请注意，您应该添加上面链接中定义的JavaScript填充程序以支持Internet Explorer 8和9.