根据按钮单击显示隐藏内容

<button id="toggleButton">点击切换显示</button>
<div id="content" style="display: none;">要显示的内容</div>

var toggleButton = document.getElementById('toggleButton');
var content = document.getElementById('content');

toggleButton.addEventListener('click', function() {
  if (content.style.display === 'none') {
    content.style.display = 'block';
  } else {
    content.style.display = 'none';
  }
});

<button id="toggleButton">点击切换显示</button>
<div id="content" class="hidden">要显示的内容</div>

.hidden {
  display: none;
}

.visible {
  display: block;
  /* 添加过渡效果以实现平滑的显示与隐藏 */
  transition: opacity 0.3s;
  opacity: 1;
}

var toggleButton = document.getElementById('toggleButton');
var content = document.getElementById('content');

toggleButton.addEventListener('click', function() {
  content.classList.toggle('hidden');
  content.classList.toggle('visible');
});