SVG动画用标签基于SMIL实现，轻量原生、无需JS；推荐嵌套在目标元素内，关键属性包括attributeName、from/to/values、dur、repeatCount、begin；复杂变换应使用；支持事件触发与JS控制；现代浏览器兼容良好，IE全系不支持。
SVG动画用
animate 标签必须写在目标元素内部或同级
href 指向它（需注意浏览器兼容性）。最稳妥写法是直接嵌套：
上面例子让圆的半径从 20 动画到 40，循环播放。关键属性说明：
-
attributeName：指定要动画的 SVG 属性名，如
cx、fill、opacity、transform（注意：transform需配合attributeType="XML"或改用 -
from / to / values：定义起始值、结束值或关键帧序列（
values="20;30;40;30;20"） -
dur：动画持续时间，单位可为
s或ms -
repeatCount：重复次数，
indefinite表示无限循环 -
begin：动画开始时机，支持
0s、click、button1.click、an1.end（依赖其他动画）等
位移、旋转、缩放建议用 animateTransform
直接对 transform 属性做
type 可选 translate、scale、rotate、skewX/skewY；from 和 to 格式按 type 变化，例如 rotate 是 角度 cx cy，translate 是 x y。
支持事件触发和暂停/恢复控制
动画可响应用户交互，比如点击开始、悬停暂停：
- 加
begin="click"实现点击触发动画 - 用
- 通过 JS 调用 SVG 元素的
beginElement()、endElement()、pauseAnimations()、unpauseAnimations()控制播放状态
例如：document.querySelector('circle').beginElement(); 可手动启动一次动画。
兼容性注意：现代浏览器支持良好，但 IE 全系不支持
Chrome、Firefox、Safari（含 iOS）、Edge（Chromium 版）均支持 SMIL。IE 所有版本不支持，若需兼容 IE，应降级为 CSS 动画（@keyframes + transform）或 JS 方案（如 GSAP、Snap.svg）。不过目前绝大多数项目已可忽略 IE。
