Javascript 如何使用相同的按钮进行打开和关闭

因此，我使用以下脚本；它打开和关闭一个侧栏

function openNav() {
    document.getElementById("mySidenav").style.width = "250px";
}

function closeNav() {
    document.getElementById("mySidenav").style.width = "0";
}

我想要实现的是，不要像这样有两个按钮

<a href="#" onclick="openNav()">Open</a>

<a href="#" onclick="closeNav()">Close</a>

要有一个按钮执行两种操作，如第一次单击时打开侧栏，第二次单击时关闭侧栏。

然后有一个按钮：

<a href="#" onclick="toggleNav()">Toggle</a>

---

仅使用一个按钮和OP的功能：

<a href='#' onclick=" \
    if (document.getElementById("mySidenav").style.width == "250px") { \
        closeNav(); \
    } else { \
        openNav(); \
    } \
">Toggle</a>

这将有一个按钮标记为toggle，单击时将调用OP的函数。反斜杠用于转义行尾字符

这必须起作用：

函数toggleNav（）{
var elem=document.getElementById（'mySidenav'）；
elem.setAttribute（'style'，（elem.clientWidth==250）？'width:0'：'width:250px'）；
}

检查样式宽度是否大于0，如果大于0，则打开。否则，关闭。您是否知道if-else语句？如果没有。我强烈建议你至少学习核心课程Javascript@user1533609我是javascript新手，刚做了这个，然后就被困在这个问题上JS250中不需要px，而不是250px可以用三元语句使它更短：element.style.width=element.style.width==“250px”？“0px”：“250px”；

<a href='#' onclick=" \
    if (document.getElementById("mySidenav").style.width == "250px") { \
        closeNav(); \
    } else { \
        openNav(); \
    } \
">Toggle</a>