如何在Javascript中设置CSS关键帧？

Question

我有一个如下所示的CSS关键帧，我的问题是我想将其设置为JavaScript（放入已经具有某些功能的div内，以便可以将“ element”值返回给我的功能]

.cylon-eye {
  background-color: yellow;
  background-image: linear-gradient( to right, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.9) 75%);
  color: none;
  height: 100%;
  width: 20%;
  animation: 4s linear 0s infinite alternate move-eye;
}
@keyframes move-eye {
  from {
    margin-left: -20%;
  }
  to {
    margin-left: 100%;
  }
}

我在建议后尝试进行如下转换，我应该调用的返回值为

.cylon-eye {
  background-color: yellow;
  background-image: linear-gradient( to right, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.9) 75%);
  color: none;
  height: 100%;
  width: 20%;
  animation: 4s linear 0s infinite alternate move-eye;
}
@keyframes move-eye {
  from {
    margin-left: -20%;
  }
  to {
    margin-left: 100%;
  }
}

？

var cylon-eye = document.getElementById("cylon-eye");

Answer 1

这对我来说很好，希望这会有所帮助：）

Answer 2

让我与您分享两个摘录，一个使用CSS + javascript