将两个相同的JavaScript合并为一个 [英] Combining two identical javascripts into one

问题描述

我已经搜索过，但坦率地说，对JS没有足够的了解，以了解其他所有结合这两个功能的帖子。

I've searched but frankly, do not know enough about JS to make sense of all of the other "combine these 2 functions" posts already out there.

我正在使用脚本来滑出联系人面板。我重复了这个脚本，然后滑出关于面板。

I am using a script to slide out a Contact Panel. I duplicated this script to then slide out the About Panel.

我想将它们合并成一个脚本来整理。可能？

I want to consolidate both into one script to tidy things up. Possible?

联系人面板：

 <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作为参数传递：

You could pass the panel ID as a parameter:

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");

这篇关于将两个相同的JavaScript合并为一个的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！