animation只触发一次解决办法。
通过js控制让animation等于空，删除animation样式。
document.getElementById("div").style.animation = "";
document.getElementById("div").style.animation = "mymove 2s";
注意点：
1.js是一条语句执行一次 清空animation一定要在动画执行完之后执行清空语句和新的animation setTimeout()
2.如果是有判断条件的情况下，通过判断条件来执行清空语句 if() switch(){}
3.js操控的样式为行间样式，当animation不是添加在行间的时候，js操作无效。应当把animation添加在行间！否则会产生小bug （非常重要的一点必须这么做可清除小bug）
4.@keyframes 这个不需要放在行间可放在任何地方 不影响任何动画效果
提醒：
使用animation 一定要通过时间轴 仔细计算行为的准确时间节点
小技巧：
animation配合setInterval()使用的时候，setInterval() 执行时间和动画执行时间长短 清空时把时间设置成0.000000000000000000001毫秒，这样边可以实现无缝切换。
例:不通过animation的次数来实现循环播放动画
<!DOCTYPE html><html>
<head>
<title></title>
<style type="text/css">
div{width: 100px;
height: 100px;
background-color: red;
}
@keyframes mymove{
0%{width: 200px;}
100{width: 390px;}
}
</style>
<script type="text/javascript">
window.onload = function (){
setInterval(function move(){
document.getElementById("div1").style.animation = "";
setTimeout(function(){document.getElementById("div1").style.animation = "mymove 2s";},30);
},2000);
}
</script>
</head>
<body>
<div id="div1" style="animation: mymove 2s;">
</div>
</body>
</html>