Question

我在http://www.w3schools.com/上找到了如何创建a responsive navigation bar

的示例

该示例以if / else语句的形式提供了一些JavaScript。我更愿意使用switch语句。

但是，当我点击图标并且没有提供任何错误时，我的switch语句不起作用。

示例的JS代码：

    var x = document.getElementById("myTopnav");
    if (x.className === "topnav") {
        x.className += " responsive";
    } else {
        x.className = "topnav";
    }

My Switch声明：

var x = document.getElementById("myTopnav");
switch (x) {
    case "topnav":
        x.className += " responsive";
        break;

    default:
        x.className = "topnav";
}

Answer 1

您正在比较x：

switch (x)

但原始代码正在比较x.className：

if (x.className === "topnav")

改为开启x.clasName：

switch (x.className)

Answer 2

你非常接近！

只需在x.className声明中换取switch(x)，就可以了：

var x = document.getElementById("myTopnav");
// use x.className below...
switch (x.className) {
    case "topnav":
        x.className += " responsive";
        break;

    default:
        x.className = "topnav";
}

将if / else语句转换为switch语句

2 个答案: