動態應用css風格

Question

你好我從xml文件（這裏是顏色和字體）中提取樣式屬性名稱 所以最後我有變量style1=color和style2= font;

但是當我寫下面的代碼 - 它不起作用 - 程序說style1是未定義的。我該如何改變它？

var header=document.createElement("div"); 
    header.setAttribute("id", "header1"); 


    header.style.style1=headerstyles[i].nodeValue; 

Answer 1

由於style1是一個變量保存實際的CSS屬性的名稱，如顏色/字體，你需要使用[]指定你不能使用.（點）運算符屬性。

header.style[style1]=headerstyles[i].nodeValue; 

Answer 2

因爲樣式本身是一個對象。你想要的是：

header.style.setAttribute（'color'，'red'）;

但IE不支持樣式對象的setAttribute。

所以使用完全跨瀏覽器支持：

header.style.cssColor = '紅';

Answer 3

您需要使用

header.style.color 
& 
header.style.fontFamily, header.style.fontSize 

改變你提到的樣式。

您還可以使用CSS Text

header.style.cssText