我怎样才能无限次点击我的按钮，因为在我点击按钮后它不再起作用

【问题标题】：How can I have infinite clicks on my button because after i click the button it does not work anymore我怎样才能无限次点击我的按钮，因为在我点击按钮后它不再起作用
【发布时间】：2021-05-31 14:52:37
【问题描述】：

<script type="text/javascript">

    //this will make it appear
    function showPicture() {
      var sourceOfPicture = "img/tierlist.jpg";
      var img = document.getElementById('tierlist')
      img.src = sourceOfPicture.replace('90x90', '225x225');
      img.style.display = "block";
    } 

    // this will remove the picture
    function removePicture() {
      var image_x = document.getElementById('tierlist');
      image_x.parentNode.removeChild(image_x);
      img.style.display = "block";
    } 
</script>

我希望它有无限的点击次数，而不仅仅是一个完成的按钮，我该怎么做？

【问题讨论】：

也许它停止工作是因为你的整个脚本崩溃了。控制台有错误吗？
您需要向我们展示您的 HTML 或您调用函数的位置。

标签： javascript html css web

【解决方案1】：

你的按钮隐藏后不会再显示图片是因为这条线

image_x.parentNode.removeChild(image_x);

您正在将元素完全从页面中删除，因此当您再次选择它时

var img = document.getElementById('tierlist')

它将无法找到该项目。

建议：想要隐藏的时候设置item的显示样式为“none”，想要显示的时候设置为“block”。示例：

function toggle(){
  var txtDiv = document.getElementById('tierlist');
  if(txtDiv.style.display == "none"){
    txtDiv.style.display = "block"
  } else{
    txtDiv.style.display = "none"
  }
}

<div id="tierlist">Hello</div>
<button onclick="toggle()">Show/hide</button>

【讨论】：