修改IE8中<style>元素的innerHTML

The*_*all 14 coding-style innerhtml internet-explorer-8

我正在创建一个样式元素,我需要将一些CSS放入其中.以下代码适用于Chrome,Safari和FF,但在IE8中失败:

var styleElement = document.createElement("style");

styleElement.type = "text/css";

styleElement.innerHTML = "body{background:red}";

document.head.appendChild(styleElement);
Run Code Online (Sandbox Code Playgroud)

在IE8中,代码在innerHTML部分时失败了.我试过做:

var inner = document.createTextNode("body{background:red}");

styleElement.appendChild(inner);
Run Code Online (Sandbox Code Playgroud)

但是,"意外调用方法或属性访问"也失败了.我正在寻找解决方法或解决方法.

小智 14

使用 .styleSheet.cssText

注意:与修改单个元素样式相比,IE8中的这个似乎非常慢.

是否有更快的方式在IE中动态修改样式表?

这在IE8中很慢:

styleElement.styleSheet.cssText = "body{background:red}";
Run Code Online (Sandbox Code Playgroud)

这在IE8中也很慢(假设要修改的样式对象是头部中的第一个样式元素):

document.styleSheets[0].cssText = "body{background:red}";
Run Code Online (Sandbox Code Playgroud)

这在IE8中很快:

document.body.style.background = "red";
Run Code Online (Sandbox Code Playgroud)