CSSKeyframesRule: метод deleteRule()

Метод deleteRule() интерфейса CSSKeyframeRule удаляет CSSKeyFrameRule, соответствующую указанному селектору ключевой кадра.

select

Строка, содержащая селектор ключевого кадра правила, которое нужно удалить. Он должен быть:

• списком значений процентов через запятую в диапазоне от 0% до 100%;
• или ключевыми словами from или to

Обратите внимание, что количество и порядок значений в указанном селекторе ключевых кадров должны соответствовать целевому(ым) правилу(ам) ключевого кадра. Пробелы игнорируются.

None (undefined).

CSS содержит правило @keyframes. Это будет первое CSSRule, возвращенное document.styleSheets[0].cssRules. myRules[0] возвращает объект CSSKeyframesRule. Возвращение свойства cssRules вернет CSSRuleList, содержащий два правила.

После удаления правила с помощью deleteRule() свойство cssRules возвращает CSSRuleList, содержащий одно правило.

@keyframes slide-in {
  from {
    transform: translateX(0%);
  }

  to {
    transform: translateX(100%);
  }
}

let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // a CSSKeyframesRule
keyframes.deleteRule("to");
console.log(keyframes.cssRules); // a CSSRuleList object with one rule