<set>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

<set> SVG 元素提供了一种在指定时间内设置属性值的方法。

它支持所有属性类型，包括那些无法合理插值的类型，例如字符串和布尔值。对于可以合理插值的属性，通常更推荐使用 <animate>。

备注： <set> 元素是非累加性的。additive 和 accumulate 属性不被允许，如果指定了这些属性，将会被忽略。

示例

html
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
  <style>
    rect {
      cursor: pointer;
    }
    .round {
      rx: 5px;
      fill: green;
    }
  </style>

  <rect id="me" width="10" height="10">
    <set attributeName="class" to="round" begin="me.click" dur="2s" />
  </rect>
</svg>

属性

to

此属性定义了在动画持续时间内应用于目标属性的值。该值必须符合目标属性的要求。值类型：<anything>；默认值：无；动画性：否

使用上下文

类别动画元素
允许的内容任意数量、任意顺序的下列元素：
描述性元素

规范

Specification
SVG Animations Level 2
# SetElement

浏览器兼容性

BCD tables only load in the browser

参见