添加2个时，HTML[显示]代码仅显示其中1个？

当我在下面添加代码时

<a id="show_id" 
   onclick="document.getElementById('spoiler_id').style.display='';
            document.getElementById('show_id').style.display='none';"
   class="link">
   [Show]
</a>
<span id="spoiler_id" style="display: none">
  <a onclick="document.getElementById('spoiler_id').style.display='none';
              document.getElementById('show_id').style.display='';"
     class="link">
  [Hide]
  </a>
<br>
INSERT CONTENT HERE
</span>

[节目]
[隐藏]


在此处插入内容

当我将其中的两个代码放入HTML页面时，我只能让其中的一个代码真正工作？关于为什么会发生这种情况有什么帮助吗

干杯，

---

James

添加第二个代码块是可行的，但是您需要确保两个代码块使用的ID不同。假设块1具有id

show\u id

和

spoiler\u id

，块2具有id

show\u id

和

spoiler\u id

，则

文档。getElementById（show\u id）

将始终选择

show\u id

的第一个出现

[ShowBlock1]
[隐藏]


在此处插入内容
[ShowBlock2]
[隐藏]


在此处插入内容

您需要设置不同的id名称。改为将getElementsByClassName与类名一起使用。ID是什么？我将如何更改ID？