Question

在我的HTML文件中，我有一个id为“divNavyBox”的div。代码如下。

<div id="divNavyBox" class="box" onmouseover="animated.doAnimation()"></div>

请注意，一旦鼠标悬停在它上面，它会从var动画执行doAnimation（）。

var animated = {

el : document.getElementById("divNavyBox"),

doAnimation : function() {
    if (el.className=="box") {

        el.className="boxAlt";
    }
    if (el.className=="boxAlt") {
        el.className="box";
    }

}

};

一旦执行方法doAnimation，我希望它在这两个cs类之间切换。但是，它没有做任何事情。我在if（el.className =“box”）中放了一个警告声明，当我执行该函数时它没有响起，即使该类真的是IS框。我想要使用的两个CS类列出下面：

.box {

    width: 100px;

    height: 100px;

    background-color: navy;

}
.boxAlt {
width: 100px;
height: 100px;  
background-color: red;
}

为什么布尔语句el.className =“box”会一直返回false？

Answer 1

如果当前= 框

，请指定 boxAlt

if (el.className=="box") {
    el.className="boxAlt";
}

此处如果当前 boxAlt ，则切换回来，如果该类从头开始框，那么这是真的。

if (el.className=="boxAlt") {
    el.className="box";
}

将其更改为：

doAnimation : function() {
    el.className = el.className == "box" ? "boxAlt" : "box";
}

Answer 2

el.className = "box"不是布尔语句，而是一个赋值。

el.className == "box"是一个布尔语句。

Answer 3

您的代码至少有三个问题：

我想知道为什么在;之前有onmouseover。

然后，您在el.className="box"中使用if()，"box"将className分配给==。使用el.style.className进行比较。

最后，{{1}}未定义。

为什么Javascript无法访问此html元素的类信息？

3 个答案: