按钮控制div(按钮控制div的显示和隐藏：代码示例)

按钮控制div的显示和隐藏可以通过JavaScript来实现。我们可以使用事件监听器来监听按钮的点击事件，并在点击时改变div的显示状态。

我们需要在HTML中定义一个按钮和一个div，并给它们分别设置一个唯一的id。按钮用来触发显示和隐藏div的操作，而div则是我们要控制显示和隐藏的元素。

<button id="toggleButton">Toggle Div</button>
<div id="myDiv">This is a div</div>

接下来，我们需要编写JavaScript代码来实现按钮控制div的显示和隐藏。我们可以通过getElementById方法获取按钮和div元素，并使用style.display属性来控制它们的显示状态。当按钮被点击时，我们可以通过判断div的当前显示状态来决定下一步的操作。

var toggleButton = document.getElementById("toggleButton");
var myDiv = document.getElementById("myDiv");
toggleButton.addEventListener("click", function() {
  if (myDiv.style.display === "none") {
    myDiv.style.display = "block";
  } else {
    myDiv.style.display = "none";
  }
});

在上面的代码中，我们使用addEventListener方法为按钮添加了一个点击事件的监听器。当按钮被点击时，代码会执行一个匿名函数。在这个函数中，我们首先检查div的当前显示状态。如果div的display属性为"none"，即div当前是隐藏的状态，我们将其display属性设置为"block"，即显示div。反之，如果div当前是显示的状态，我们将其display属性设置为"none"，即隐藏div。

通过以上的代码，我们实现了按钮控制div的显示和隐藏。当我们点击按钮时，div会在显示和隐藏之间切换。