我正在使用以下代码更改样式表中的类定义:
/*
* At this point it is:
* "position: absolute; height: 20px; background-image: none; background-position: initial initial; background-repeat: initial initial;"
* But I actually set "background: none;" in my css file
*/
var cssText = document.styleSheets[ 0 ][ "cssRules" ][ 3 ].style.cssText;
//Just replace the height
document.styleSheets[ 0 ][ "cssRules" ][ 3 ].style.cssText = cssText.replace( "height: 20px", "height: 14px" );
/*
* Now when I print it out, it's:
* "position: absolute; height: 20px;"
*/
console.log( document.styleSheets[ 0 ][ "cssRules" ][ 3 ].style.cssText );
如果我重新附加“background:none;”然后它放回“background-image:none; background-position:initial initial; background-repeat:initial initial;”东西。 (奇怪的是,如果我附加“background-image:none; background-position:initial initial; background-repeat:initial initial;”,那么它只显示没有任何背景信息!)
知道为什么会这样吗?
编辑:我使用cssText而不是直接访问样式的原因是,我需要设置"!important"
并且除了cssText之外别无他法这样做。