动画在javascript中显示一个div

基本上，我有一个div，我希望它发光。我使用CSS实现了这一点，但我想切换到javascript

以下是我的CSS方法：

@keyframes glowing{
            0% { box-shadow: 0 0 3px 0px #001bae; }
            50% { box-shadow: 0 0 6px 2px #001bae; }
            100% { box-shadow: 0 0 3px 0px #001bae;}
}
.CountryLoc{
            position:absolute;
            height:2px;
            width:2px;
            background:#001bae;
            border-radius: 100%;
            display:block;
            box-shadow: 0 0 6px 1px #001bae;
            animation: glowing 2000ms infinite;
}

如果要实时查看我当前的方法，请访问：

我想在上面切换到javascript动画

我可以使用下面的脚本淡出长方体阴影光晕，但它不会再次亮起/淡出到

100%{box shadow:0 0 3px 0px#001bae；}

 anime({
                targets:'.CountryLoc',
                'box-shadow':'0 0 6px 0px #001bae',
                duration:1000,
                loop:true
});

---

我不知道Anime.js，但使用，您可以相当轻松地翻译CSS动画。下面的示例接收关键帧并用于设置动画

const keyframes = [
  { boxShadow: '0 0 3px 0px #001bae' },
  { boxShadow: '0 0 6px 2px #001bae' },
  { boxShadow: '0 0 3px 0px #001bae' }
];

const timing = {
  duration: 2000,
  iterations: Infinity;
};

const targets = document.querySelectorAll('.CountryLoc');
targets.forEach(target => target.animate(keyframes, timing);

虽然还不清楚你为什么要做出改变。CSS是大多数性能最好的选项，您不需要任何动态动画