如何使用javascript更改关键帧值"from - to“onclick

// 获取要更改的元素
var element = document.getElementById("myElement");

// 创建一个新的关键帧动画
var keyframes = [
  { transform: 'translateX(0)' },
  { transform: 'translateX(100px)' }
];

// 创建一个新的动画效果
var animation = element.animate(keyframes, {
  duration: 1000, // 动画持续时间（毫秒）
  iterations: 1, // 动画重复次数
  fill: 'forwards' // 动画结束后保持最后一个关键帧的状态
});

// 在点击事件中触发动画
element.onclick = function() {
  animation.play(); // 播放动画
};