怎么用onclick触发动画

在HTML元素中使用onclick事件可以触发JavaScript代码，在JavaScript代码中可以使用CSS动画属性来触发动画效果。例如，我们可以在HTML元素中添加一个onclick事件，然后在JavaScript代码中使用classList属性来添加CSS动画类，从而触发动画效果。示例如下：

HTML代码：

<button onclick="startAnimation()">点击触发动画</button>
<div id="animate">这是一个要进行动画的元素</div>

CSS代码：

.animate {
  animation-name: example;
  animation-duration: 2s;
}

@keyframes example {
  from {transform: translateX(0);}
  to {transform: translateX(100px);}
}

JavaScript代码：

function startAnimation() {
  var animateElement = document.getElementById("animate");
  animateElement.classList.add("animate");
}

当点击按钮时，会执行startAnimation()函数，该函数会获取ID为"animate"的元素，并将其添加"animate"类，从而触发CSS动画效果。