Javascript CSS deleteRule 属性

Question

嘿，我想弄清楚为什么 deleteRule 不适用于我在 javascript 中的 css 对象。我做了一个非常简单的测试来说明。 http://codepen.io/wzsun/pen/uzcvI

console.log(cssRule.cssRules.length); <-- returns 2
cssRule.deleteRule(1); // <-- can't delete
cssRule.insertRule("to { -webkit-transform: rotatex(360deg); background-color:blue;}") // <-- this works
console.log(cssRule.cssRules.length); <-- returns 3
console.log(cssRule);
cssRule.deleteRule(2);

我可以插入规则，但不能删除规则。感谢您的帮助。

Answer 1

我对您展示的问题很感兴趣，我想我找到了答案。如果你想调用 removeRule 你必须通过属性 DOMString 键删除规则

void            deleteRule(in DOMString key);

及其介于 0 和 1 之间的值(例如 0%、50%、100%)。这就是索引传递不起作用的原因。

CSSKeyframe.keyText Represents the key of the keyframe, like '10%', '75%'. The from keyword maps to '0%' and the to keyword maps to '100%'

CSSKeyframesRule MDN.

你所要做的就是找到一个keyText(msdn，mdn)然后简单地用它来deleteRule()

keyToRemove = cssRule.cssRules[1].keyText;
console.log(cssRule);
console.log(cssRule.cssRules.length);
cssRule.deleteRule(keyToRemove);

这是一个 example .