CSSKeyframesRule:appendRule() 方法
>CSSKeyframeRule 接口的 appendRule() 方法用于将一个 CSSKeyFrameRule 追加到规则列表的末尾。
语法
js
appendRule(rule)
参数
rule-
一个包含关键帧规则的字符串。
返回值
无(undefined)。
示例
以下 CSS 中包含一个关键帧 at 规则。这将是 document.styleSheets[0].cssRules 返回的第一个 CSSRule。myRules[0] 返回一个 CSSKeyframesRule 对象。其 cssRules 属性会返回一个包含一条规则的 CSSRuleList。
使用 appendRule 追加另一条规则后,cssRules 属性会返回一个包含两条规则的 CSSRuleList。
css
@keyframes slide-in {
from {
transform: translateX(0%);
}
}
js
let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // CSSKeyframesRule
keyframes.appendRule("to {transform: translateX(100%);}");
console.log(keyframes.cssRules); // 包含两条规则的 CSSRuleList
规范
| 规范 |
|---|
| CSS Animations Level 1> # interface-csskeyframesrule-appendrule> |