javascript - 如何让一个 JavaScript 函数控制两个 HTML ID？

Question

我有这个按钮标签元素

<button class="btn btn-link" type="button" onclick="contentDownloads()">
<img src="./downloads/content-textures.svg" width="120px" />
</button>

并且有一个javascript函数

      function contentDownloads() {
        var x = document.getElementById("vipDownloads");
        if (x.style.display === "none") {
          x.style.display = "block";
        } else {
          x.style.display = "none";
        }
      }

但是，将来我会包含更多按钮并导致相同的功能。

这是包含 ID 的部分:

<div id="vipDownloads" class="collapse show" style="display: none;">     
<div class="card-body">
<h5 class="card-title">Map Pack v 1.8 <span class="caption-entry">by cWaLker</span> </h5>
<p class="card-text">
Aight Fellas,
Map Pack v 1.8 introduces some revived classics and under the radar stunners. <br>
<br> 1.7 went on a diet and dropped some restraining pounds.
For this nugget to work stable, you'd need to remove your own user folder first and then drop the User folder from the 1.8 bulk package.. it will serve you everything you need anyways ;-)<br>
<br> Have Fun Guys lets kick some flips!              
</p>
<a href="https://drive.google.com/open?id=1SNivhvHi-4PjPDy1tob-91HYs3x3R_z9" target="_blank"><button type="button" class="btn btn-outline-success">Download</button></a><br>           
</div>
</div>

你可以在这里看到我是如何设计按钮和内容的http://thpsblog.000webhostapp.com/downloads.html (我主机上的 css 需要一段时间才能实际更新，可能包括一些白色的白色)

该函数隐藏和取消隐藏内容。

我找到了一些解决方案，但它们都是用 jQuery 键入的，不幸的是我不懂 jQuery。

我怎样才能让这个函数接受两个唯一的 ID？

Answer 1

制作元素的ID来切换函数的参数，并在调用函数时传递。

function contentDownloads(id) {
  var x = document.getElementById(id);
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}

<button class="btn btn-link" type="button" onclick="contentDownloads('vipDownloads')">
<img src="./downloads/content-textures.svg" width="120px" />
</button>