javascript - 隐藏事件元素并在点击时用新元素替换它(javascript)

Question

我有一个表格，表格头部有很多链接按钮。此按钮的工作方式类似于表格内容的切换器。 目前只显示一张表，其他表隐藏。因此，如果我单击按钮，我想隐藏当前表格并显示新表格。 我使用这个简单的 javascript

<script>
function hideStuff(element_id) { document.getElementById(element_id).style.display = 'none';}
function showStuff(element_id) { document.getElementById(element_id).style.display = 'block'; }
</script>

和点击事件

onclick="showStuff('table2'); hideStuff('table1');

但是我那里有很多按钮，但我不知道，例如，我点击了 table9 按钮，但我需要隐藏哪个表格？ (表 1、2、3...10 可以激活)

所以我的问题是如何修改我的代码以隐藏事件元素(表格)并显示新的(所需的)

谢谢。

Answer 1

给你所有的元素一个相同的类，例如linkBut​​tons，那么你只需要一个函数:

function showStuff(element_id) {
    var elements = document.getElementsByClassName('linkButtons');
    for (var i = 0, length = elements.length; i < length; i++) {
        elements[i].style.display = 'none';
    }
    document.getElementById(element_id).style.display = 'block';
}