用jQuery将样式表附加到iframe
我正在创建一个HTML编辑器，类似于我现在使用下面的输出键入的那个。 我正在使用iframe并将$ htmlTextBox.val（）转储到iframe的正文中。
我试图在iframe中创建一个样式表，以使其看起来像它的工作。
提前致谢！
$htmlTextBox.keyup(function(){
SetPreview();
});
function SetPreview()
{
var doc = $preview[0].contentWindow.document;
var $body = $("body", doc);
$body.html($htmlTextBox.val());
}
虽然您可以与iframe的document.styleSheets进行交互，但老派可靠的方法是首先将样式表放在那里（通过编写iframe-src指向具有所需样式表的空文档），或将其放入使用document.write() 。 例如：
<body>
<iframe></iframe>
<script type="text/javascript">
var d= frames[0].document;
d.open();
d.write(
'<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional //EN" "http://www.w3.org/TR/html4/loose.dtd">'+
'<html><head><style type="text/css">'+
'body { font-size: 200%; }'+
'</style></head><body></body></html>'
);
d.close();
d.body.innerHTML= '<em>Hello</em>';
</script>
</body>
（这也会将iframe文档设置为标准模式，假设这是您想要的。）
跟进：
HTML
<iframe id="message" name="message" />
jQuery的
setTimeout(function() {
var $head = $("#message").contents().find("head");
$head.append($("<link/>",
{ rel: "stylesheet", href: url, type: "text/css" }
));
}, 1);
我们可以将样式标签插入到iframe中。
<style type="text/css" id="cssID">
.className
{
background-color: red;
}
</style>
<iframe id="iFrameID"></iframe>
<script type="text/javascript">
$(function () {
$("#iFrameID").contents().find("head")[0].appendChild(cssID);
//Or $("#iFrameID").contents().find("head")[0].appendChild($('#cssID')[0]);
});
</script>