我有一个div盒子一个按钮请使用js写出点击按钮后以动态特效的方式将div显示出来

可以使用以下代码实现：

HTML代码：

<button id="showDivBtn">显示盒子</button>
<div id="myDiv"></div>

CSS代码：

#myDiv {
  display: none;
  width: 200px;
  height: 200px;
  background-color: #f0f0f0;
  position: relative;
  animation-duration: 1s;
  animation-name: slideIn;
}

@keyframes slideIn {
  0% {
    top: -200px;
  }
  100% {
    top: 0;
  }
}

JS代码：

var showDivBtn = document.getElementById("showDivBtn");
var myDiv = document.getElementById("myDiv");

showDivBtn.onclick = function() {
  myDiv.style.display = "block";
  myDiv.classList.add("slide-in");
}

解释：

首先，我们获取按钮和盒子的DOM元素。然后，给按钮添加一个点击事件，当点击按钮时，将盒子的display属性设置为"block"，这样盒子就能显示出来了。

但是，我们希望盒子能够以动态特效的方式显示出来，因此需要为盒子添加一个类名"slide-in"，这个类名对应了一个CSS动画"slideIn"，这个动画会将盒子从上方滑动到屏幕中央，从而形成一个动态特效。