JavaScript 实现 div 盒子动态弹出显示

function showBox() {
  var box = document.getElementById('myBox');
  if (box.style.display === 'none') {
    box.style.display = 'block';
  } else {
    box.style.display = 'none';
  }
}

首先，我们在 HTML 中定义了一个 id 为 'myBox' 的 div 盒子，并设置了它的初始样式，包括宽度、高度、背景颜色和 display 属性为 'none'，使其初始状态为隐藏。我们还定义了一个按钮，并设置 onclick 属性为 'showBox()'，表示点击按钮时执行 showBox() 函数。

在 JavaScript 中，showBox() 函数首先通过 getElementById() 方法获取到 'myBox' 的引用，然后判断当前它的 display 属性是否为 'none'。如果是，则设置它的 display 属性为 'block'，使其显示出来；如果不是，则设置它的 display 属性为 'none'，使其隐藏起来。这个过程通过改变 CSS 的 display 属性来实现。

这样，我们就可以通过点击按钮来控制 div 盒子的显示和隐藏状态了。