javascript - 一种读取或更改 CSS 动画关键帧的方法

Question

在 JavaScript 中，很容易获得应用于元素的 CSS 动画的名称和属性:

var animName = element.style.webkitAnimationName;
// element.style.mozAnimationName
// etc...

但是有没有办法读取甚至更改动画的 CSS 关键帧？

Answer 1

多亏了评论，我才能够得到这个解决方案:

var allStyles = document.styleSheets;
var keyframeType = window.CSSRule.WEBKIT_KEYFRAMES_RULE || window.CSSRule.KEYFRAMES_RULE;

for (var declaration in allStyles) {
  if (allStyles.hasOwnProperty(declaration)) {
    var ruleSet = allStyles[declaration].cssRules;

    for (var rule in ruleSet) {
      if (ruleSet.hasOwnProperty(rule)) {
        var currentRule = ruleSet[rule];

        if (currentRule.type == keyframeType) {
          console.log(currentRule);
        }
      }
    }
  }
}