創建並填充<style>元素

Firefox和Chrome讓我創建一個<style>元素和填充它，一切從JavaScript。我可以發誓說，在過去，我已經在IE中完成了這項工作（如IE6），但在不同的情況下。但現在我無法獲得IE瀏覽器（7或8;還沒有嘗試9）讓我設置它。我有這個「cssText」屬性的回憶，但現在在（神祕地減少;是否有人知道發生了什麼MSDN文檔網站？）MSDN文檔，只顯示爲樣式表API的一部分，而不是作爲DOM元素的東西。創建並填充<style>元素

所以：是它在所有可能的創建和填充在Internet Explorer中的<style>元素？

Here是微不足道的jsfiddle例子，用下面的jQuery代碼：在Firefox，鉻和Opera

$('head').append($('<style/>', { html: 'div { color: red; }' }));

工作正常。（我想我應該嘗試Android和iOS，而我在這。）

編輯 —是的，我已經試過設置「文本」，而不是「HTML」，而它並不能幫助。試圖在沒有jQuery的情況下設置「innerText」也不起作用。

來源

2012-04-27 Pointy

是你尋找這個方法：http://stackoverflow.com/questions/436710/element-appendchild-chokes-in-ie？ – 2012-04-27 15:42:53

這裏是我這樣做過。我已經差不多複製這種直出我的一些舊的代碼，但如果我沒有記錯，在styleSheet屬性只能通過IE使用，正如你所說，這時候你需要使用cssText：

var styleElem = document.createElement("style"); 
styleElem.type = "text/css"; 
styleRules = document.createTextNode(".someClass { color: red; }"); 
if(styleElem.styleSheet) { 
    styleElem.styleSheet.cssText = styleRules.nodeValue; 
} 
else { 
    styleElem.appendChild(styleRules); 
} 
document.getElementsByTagName("head")[0].appendChild(styleElem);

這裏有一個working example（在最新的Chrome和IE6測試）。

來源

2012-04-27 15:43:03

是的，我認爲是對的;衛生署。我會試一試，並在一秒鐘內接受。 – Pointy 2012-04-27 15:44:11

哦，我想我會記錄一個jQuery錯誤，因爲它確實應該讓我以某種方式做到這一點。 – Pointy 2012-04-27 15:44:38

@Pointy - 是啊，看到jQuery是旨在規範瀏覽器不一致，我認爲這將是一個有益的補充。 – 2012-04-27 15:47:26

創建並填充<style>元素

回答

相關問題