javascript - IE修改样式表规则不刷新

Question

我正在通过 JS 向样式表添加规则，然后尝试编辑该规则。它在其他地方工作正常，但在 IE 中不行。

我知道在 IE 中访问样式表和规则的区别，我想修改现有属性也一定有区别，请参阅我的（仅限 IE）示例：

<style type="text/css" rel="stylesheet" id="tmp-style"></style>
<h3>Test</h3>
<script type="text/javascript">
    var sheet = document.styleSheets[0];
    sheet.addRule('h3', 'background-color: red', 0);
    console.log( sheet.rules[0].selectorText + ' = ' + sheet.rules[0].style['background-color'] );
    sheet.rules[0].style['background-color'] = 'blue';
    console.log( sheet.rules[0].selectorText + ' = ' + sheet.rules[0].style['background-color'] );
</script>

H3 保持红色，控制台显示：

LOG: h3 = undefined 
LOG: h3 = blue

Answer 1

Ok it turns out that to access the style properties this way via JS in IE you must use the camel case notation to access them, e.g.:

sheet.rules[0].style['backgroundColor'] = 'blue';