时间戳

首页 > 解决方案 > 如何在 JavaScript 中显示/隐藏元素？

javascript - 如何在 JavaScript 中显示/隐藏元素？

问题描述

我正在创建一个 div 元素来测试在 JS 中为我​​的日历程序隐藏和显示一个元素。我有一个用于x.style.display在页面中呈现或隐藏 div“信息”的功能。但是当我测试它时它不起作用；当我单击按钮时，“信息” div 会正常显示在屏幕上。

function show() {
  var divide = document.getElementById("info").innerHTML;
  if (divide.style.display === "hidden") {
    divide.style.display = "block";
  } else {
    divide.style.display = "hidden";
  }
}
<button onclick="show()">Show/Hide</button>
<div class="info">Testy</div>

标签： javascripthtmlcss

解决方案

您已经使用了 innerHtml 用于分配字符串。所以删除它并隐藏你可以使用display:none不隐藏。

function show() {
  var divide = document.getElementById("info");
  if (divide.style.display === "none") {
    divide.style.display = "block";
  } else {
    divide.style.display = "none";
  }
}
<div id="info">Testy</div>
<button onclick="show()">Show/Hide</button>

推荐阅读