javascript - 将两个相同的JavaScript组合成一个

我进行了搜索，但坦白说，我对JS的了解还不够多，无法理解已经存在的所有其他“结合这2个功能”帖子。

我正在使用脚本滑出“联系人面板”。我复制了此脚本，然后滑出“关于面板”。

我想将两者合并为一个脚本来整理。可能？

联络面板：

 <script type="text/javascript">
    function showContactPanel() {
    var elem = document.getElementById("contact-panel");
    if (elem.classList) {
      elem.classList.toggle("show");
    } else {
      var classes = elem.className;
      if (classes.indexOf("show") >= 0) {
        elem.className = classes.replace("show", "");
      } else {
        elem.className = classes + " show";
      }
      console.log(elem.className);
    }
    }
</script>

与“关于”面板重复：

<script type="text/javascript">
    function showAboutPanel() {
    var elem = document.getElementById("about-panel");
    if (elem.classList) {
      elem.classList.toggle("show");
    } else {
      var classes = elem.className;
      if (classes.indexOf("show") >= 0) {
        elem.className = classes.replace("show", "");
      } else {
        elem.className = classes + " show";
      }
      console.log(elem.className);
    }
    }
</script>

最佳答案

您可以将面板ID作为参数传递：

function showPanel(id) {
    var elem = document.getElementById(id);
    if (elem.classList) {
        elem.classList.toggle("show");
    } else {
        var classes = elem.className;
        if (classes.indexOf("show") >= 0) {
            elem.className = classes.replace("show", "");
        } else {
            elem.className = classes + " show";
        }
        console.log(elem.className);
    }
}

然后这样称呼：

showPanel("about-panel");

要么

showPanel("contact-panel");