insertRule和addRule

Question

在我正在开发的网站上，我必须随时随地为css创建规则，但出于某种原因 insertRule和addRule不想工作。

以下是代码：

function change(anim, fromValue, toValue) {
    // find our -webkit-keyframe rule
    var keyframes = findKeyframesRule(anim);

    // remove the existing 0% and 100% rules
    keyframes.deleteRule("0%");
    keyframes.deleteRule("100%");

    if(keyframes.insertRule){
        // create new 0% and 100% rules with random numbers
        keyframes.insertRule("0% {background-position: " + fromValue + ";}");
        keyframes.insertRule("100% {background-position: " + toValue + ";}");
    }else{
        keyframes.addRule("0%","{background-position:" +fromValue+";}",0);
        keyframes.addRule("100%","{background-position:" +fromValue+";}",1);
    }
}

奇怪的是，firefox能够通过deleteRule但是当它到达insertRule和addRule时它就不起作用了。此外，代码确实在chrome中工作，所以我倾向于相信我可能只是缺少一些小东西。

编辑： 在调试时，似乎甚至没有定义函数，但deleteRule是。现在有什么想法吗？