Javascript 一页网站上div的后退按钮/操作（hideStuff/showtuff功能）

我对找到一种方法在一页网站上创建一个后退按钮感到有点沮丧，在这个按钮中，内容隐藏并显示在由hideStuff/showtuff函数操纵的div中

搜索并没有解决我的问题（也许我错过了什么）

谢谢你的建议和提示

<script type="text/javascript">
  function showStuff(id) {
    document.getElementById(id).style.display='block';
  }

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

<div id = '1'>
  <a name="1"></a>
  <a href = '#2' onclick="showStuff('2'); hideStuff('1');">2</a><br>
  <a href = '#3' onclick="showStuff('3'); hideStuff('1');">3</a><br>
  <a href = '#4' onclick="showStuff('4'); hideStuff('1');">4</a>
  <br><br><i>('1')</i>
</div>

<div id = '2' style='display: none'>
  <a name="2"></a>
  <a href = '#1' onclick="showStuff('1'); hideStuff('2');">1</a><br>
  <a href = '#3' onclick="showStuff('3'); hideStuff('2');">3</a><br>
  <a href = '#4' onclick="showStuff('4'); hideStuff('2');">4</a>
  <br><br><i>('2')</i>
</div>

<div id = '3' style='display: none'>
  <a name="3"></a>
  <a href = '#1' onclick="showStuff('1'); hideStuff('3');">1</a><br>
  <a href = '#2' onclick="showStuff('2'); hideStuff('3');">2</a><br>
  <a href = '#4' onclick="showStuff('4'); hideStuff('3');">4</a>
  <br><br><i>('3')</i>
</div>

<div id = '4' style='display: none'>
  <a name="4"></a>
  <a href = '#1' onclick="showStuff('1'); hideStuff('4');">1</a><br>
  <a href = '#2' onclick="showStuff('2'); hideStuff('4');">2</a><br>
  <a href = '#3' onclick="showStuff('3'); hideStuff('4');">3</a>
  <br><br><i>('4')</i>
</div>

<a href="#" onclick="history.back(-1);">Back</a>

函数showStuff（id）{
document.getElementById（id.style.display='block'；
}
函数hideStuff（id）{
document.getElementById（id.style.display='none'；
}






（‘1’）






（‘2’）






（‘3’）






（‘4’）

history.back（）只适用于url更改。您在这里所做的只是显示和隐藏div，因此历史概念不能在这里使用

您可以对元素使用class而不是id，并在按钮上执行一些onclick功能，以显示相关类的元素并隐藏相关类的元素。使用切换功能。希望有帮助。

谢谢您的回答！但我知道这是行不通的，这就是为什么在这里要求某种解决方案的原因。或者在这种情况下根本不可能？请维护一个存储隐藏的ID的数组，因此当您单击“上一步”时，从后面遍历该数组并显示该特定div并隐藏其余div