getanimations() 是 dom 元素方法，返回当前元素所有运行或暂停未结束的动画实例；需确保动画已真实启动，注意兼容性及多动画遍历判断。
getAnimations() 不是 HTML 的方法，而是 DOM 元素（Element）的原生 JavaScript 方法。它能拿到当前元素上所有正在运行或已暂停但未结束的 CSS 动画和 Web Animations API 动画实例。
调用 getAnimations() 前必须确保动画「真正在播」
很多人写了 animation: spin 2s infinite; 却调 getAnimations() 返回空数组——不是 API 失效，而是动画根本没启动。常见原因：
- CSS 动画未生效：比如元素
display: none、visibility: hidden或尚未插入 DOM - @keyframes 名字拼错，或
animation-name值为none - 动画刚定义完就立刻调用，浏览器还没触发渲染帧（可包一层
requestAnimationFrame再查） - 用了
animation-play-state: paused但没调play()，此时动画状态是idle而非running，getAnimations()仍会返回它（只要没被 cancel 或 finish）
getAnimations() 返回的是 Animation 对象数组，不是 CSSRule
返回值里每个项都是 Animation 实例（类型为 CSSAnimation 或 Animation），不是 CSS 样式规则，不能直接改 @keyframes 定义。你能做的只有控制播放状态、时间、速率等：
-
anim.playbackRate = 2：加速到 2 倍速（注意：设负值会反向，但 CSS 动画默认不支持负 playbackRate，Chrome/Firefox 支持，Safari 16.4+ 才开始支持） -
anim.currentTime = 500：跳转到第 500ms（单位毫秒），需先pause()再设再play()，否则可能被忽略 -
anim.onfinish = () => {...}：监听自然播完，但 CSS 动画若设了infinite就永远不会触发finish
兼容性差？别硬扛，降级要有明确 fallback 路径
getAnimations() 在 Safari 16.4+、Chrome 115+、Firefox 73+、Edge 79+ 可用；旧版 Safari（iOS 15.6 及更早）、IE 完全不支持。降级不能只写个 if (!el.getAnimations) 就 return，得有实际替代方案：
- 用
el.classList.add('paused')+ CSS 里定义.paused { animation-play-state: paused; }，但无法读取当前时间点 - 靠
animationstart/animationend事件 + 自维护状态变量（如isAnimating = true），适合简单开关场景 - 对关键路径（如用户交互触发的动画控制），建议检测失败后直接禁用 JS 控制逻辑，退回到纯 CSS 行为，避免半残体验
真正容易被忽略的是：同一个元素可能同时存在多个动画（比如 transform + opacity 分开定义），getAnimations() 返回的是全部，不是「主动画」。你得自己遍历判断哪个是你要操作的那个——别想当然 animations[0] 就是旋转动画。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
