Javascript 切换div时添加和删除类

您好，我的代码有问题，我的页面中有一个菜单和一个地图，当页面加载时，地图有

col-lg-10 col-md-10 col-sm-10 col-xs-10

，因为我的菜单是打开的，当我关闭菜单时，我使地图更改为

col-lg-12 col-md-12 col-sm-12 col-xs-12

，它工作正常，但当我重新打开菜单时，它不会将类更改为

col-lg-10 col-md-10 col-sm-10 col-xs-10

这是我试过的代码

更新

谢谢大家的回答，我已经添加了

=

，但是现在它只添加了

col-lg-10

类

 function MapSize() {
        var shown = document.getElementById("containerForm");
        var map = document.getElementById("containerMap");

        if (shown.style.display == "none") {

            map.className = "col-lg-12 col-md-12 col-sm-12 col-xs-12";


        } else if (shown.style.display == "block") {
            map.className += "col-lg-10 col-md-10 col-sm-10 col-xs-10";
        }
    }  

---

谢谢：）

您正在if语句中使用赋值运算符

而不是

if（display.style.display=“无”）

应该是

---

if（display.style.display==“none”）

赋值运算符，而不是if中的比较运算符：

 if (shown.style.display = "none") {

使用

==

function MapSize() {

        var shown = document.getElementById("containerForm");
        var map = document.getElementById("containerMap");

        if (shown.style.display == "none") {

            map.className = "col-lg-12 col-md-12 col-sm-12 col-xs-12";


        } else if (shown.style.display == "block") {
            map.className = "col-lg-10 col-md-10 col-sm-10 col-xs-10";
        }
    } 

问题不止一个：

1） 使用

==

进行相等性检查

if（show.style.display==“none”）

应该是if

（show.style.display==“none”）

2） 当您执行

map.className=“col-lg-12 col-md-12 col-sm-12 col-xs-12”

您的旧类

col-lg-10 col-md-10 col-sm-10 col-xs-10

不见了。您可以打开chrome开发工具来检查类名

使用

map.className+=

而不是

map.className=

3）

map.className.remove是一个函数吗？请打开开发工具以检查错误
 这样试试

function MapSize() {
    var shown = document.getElementById("containerForm");
    var map = document.getElementById("containerMap");

    map.className = (shown.style.display === "none") ? "col-lg-12" : "col-lg-10";
}  

顺便说一句，在bootstrap 3类中，“col-lg-12 col-md-12 col-sm-12 col-xs-12”

等同于

“col-lg-12”

，以及

“col-lg-10 col-md-10 col-sm-10 col-xs-10”

等同于

“col-lg-10”

将

=/code>更改为
=/code>。单相等是赋值，而不是相等。请添加您的html。您的运算符确实应该告诉我们==所有答案（到目前为止）都告诉您使用
==
-除了@Taplar，他是对的。你应该使用
==
（），除非你有一个很好的理由使用
==
（松散相等）来进行自动类型强制。除了将
=
更改为
=
或
==
之外，您的
map.className=xxx
覆盖了原来的类…做了新的更改，做得很好。您可能需要检查的一件事是
style=display:block
是否在
show
元素上显式设置。我用一个div尝试了这段代码，它的默认行为是display block，但它不起作用。请使用
===
，除非您有很好的（并且很好理解的）理由使用
=