js 操作css实现代码_javascript技巧

当我们需要的是一条规则的时候，总不能在每次dom发生变化的时候去执行这个操作，否则也太效率低下了。
好在dom中css rules也是可以修改的。不过不同浏览器的对于css rules的接口描述也不同，其中ie中以类似hash table的方式，而ff以数组方式。
从可编程性上说，ie的接口描述更讨程序员喜欢，不过从逻辑上说，ff显然更为合理。
我提供了类似于ie的方式对两套代码进行简单包装，不过ie在dom的css removeRule之后并不能确定同步的把规则兑现。所以最好用规则覆盖的方式而非remove。
需要注意的是，在使用改js函数的时候，页面上至少要有一个style标签。下面是代码及示例。

复制代码 代码如下:

<script> <BR>function addCSSRule(key,value){ <BR>var css = document.styleSheets[document.styleSheets.length-1]; <BR>css.cssRules ? <BR>(css.insertRule(key+"{"+value+"}", css.cssRules.length)) : <BR>(css.addRule(key,value)) ; <BR>} <BR>function removeCSSRule(key){ <BR>for(var i = 0; i < document.styleSheets.length; i++){ <BR>var css = document.styleSheets[i]; <BR>css.cssRules ? <BR>(function(){ <BR>for(var j = 0; j < css.cssRules.length; j++){ <BR>if(css.cssRules[j].selectorText==key){ <BR>css.deleteRule(j); <BR>} <BR>} <BR>})() : <BR>(css.removeRule(key)) ; <BR>} <BR>} <BR></script>

abc

add

remove