document.write style css javascript

我从数据库中拉取了一点html和css，并且恰好包含了一点css包裹在样式标记中。然后，我将一些innerhtml设置为字符串变量并显示它。document.write style css javascript

html呈现正常，但即不会显示与CSS的内容 - 当然Firefox会。下面是代码

var outputString = '<style type="text/css">.fontRed{color:red;}</style><span class="fontRed">red</span>'

我然后将其设置到的innerHTML

document.getElementById('bilbo').innerHTML = outputString;

的缩写例如这可以正确地显示在FF（红色），但并不在IE中。有没有我需要为IE浏览器转义的角色？其余的html工作，甚至内联样式在IE中都能正常工作。

任何援助将是最受欢迎的。

感谢

来源

2012-11-06 user1689274

想如果你所描述的确实能做到*在IE帮助。顺便说一句，使用'.fontRed {color：red;}'这样的风格完全忽略了CSS的重点。 – Madbreaks

我给出了一个简短的代码片段。 outputString被设置为从db中提取的CLOB，在这种情况下，这是一个文本填充的网页，用于解释某些内容。我想要按原样显示网页。它在FF中正确显示，而不是在IE中，也就是说css部分不会在IE中呈现。 – user1689274

拉出的代码不是我写的网页，它实际上只不过是用户协议的一大堆文本。所以我必须与我所得到的一起工作...... IE中的代码呈现没有CSS，在该示例中文本将是黑色的，而不是红色的。 IE不识别风格标签 – user1689274

只需在输出字符串的开头输入<body>即可。即

document.getElementById('bilbo').innerHTML = '<body>' + outputString;

查看http://jsfiddle.net/ScEZ4/1/进行工作演示。

测试和工作IE6，IE7，IE8，IE9，FF16，Chrome22，Opera12

来源

2012-11-06 22:51:30 Alohci

之间的任何内容谢谢。这工作正常，我感谢帮助。 – user1689274

试试这个办法..经测试，在IE7及以上

// Create the Style Element 
var styleElem = document.createElement('style'); 
styleElem.type = 'text/css' ; 

var css = '.fontRed{color:red;}' ; 

if(styleElem.styleSheet){ 
    styleElem.styleSheet.cssText = css; 
} 
else{ 
    styleElem.appendChild(document.createTextNode(css)); 
} 

// Append the Style element to the Head 
var head = document.getElementsByTagName('head')[0] ; 
head.appendChild(styleElem); 

// Append the span to the Div 
var container = document.getElementById('bilbo'); 
container.innerHTML = '<span class="fontRed">red</span>' ;

Check FIDDLE

来源

2012-11-06 21:59:16

追加<style type="text/css">.fontRed{color:red;}</style>到head标签第一。

来源

2012-11-06 22:11:57 Jules