创建'的新实例；动画'；（div上的CSS属性）使用JavaScript

我有一个带有类反馈的元素，当调用JavaScript函数时，会添加反馈动画

document.querySelector('.feedback').classList.add('feedbackAnimate');

我希望在每次调用函数时播放动画，但不希望“删除”/“重置原始动画”。我猜我需要创建新的div实例，对吗？如何从JavaScript实现这一点

动画CSS：

.feedback {
  width: 30px;
  height: 30px;
  overflow: hidden;
  background-color: green;
  z-index: 20;
  left: calc(50% - 15px);
  top: 0;
  position: absolute;
  z-index: -2;
}

.feedbackAnimate {
  animation-name: removeLayer;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  transform: translateY(-300%);
  transform-origin: bottom right;
  opacity: 1;
}

@keyframes removeLayer {
  0% {
    transform: translateY(0%);
    opacity: 0;
  }
  100% {
    transform: translateY(-300%);
    opacity: 1;
  }
}

---

取决于动画。让我们看看你的动画在代码方面是什么样子的。嗨@WaisKamal，我已经将动画CSS添加到主PostAddJavaScript“调用”代码以及调用该代码的HTML中function@Vepthy，JS就是我上面所说的，在函数

function incrementScore（）{document.querySelector（'.feedback'）.classList.add中（'feedbackAnimate'）；}

HTML只是

您所说的是不可能做到的。您希望如何在不重置上一个班次的情况下，每次将反馈元素向下移动300%的高度？您的元素将很快耗尽屏幕空间。取决于动画。向我们展示您的动画在代码方面的外观。您好@WaisKamal，我是我已经将动画CSS添加到主PostAddJavaScript“调用”代码以及调用该代码的HTMLfunction@Vepthy，JS就是我上面所说的，在函数

函数incrementScore（）{document.querySelector（'.feedback'）.classList.add（'feedbackAnimate'）；}中

HTML只是

您所说的是不可能做到的。您希望如何在不重置上一个班次的情况下，每次将反馈元素向下移动300%的高度？您的元素很快就会耗尽屏幕空间。