1. 通過JavaScript設(shè)置元素的樣式

通過元素(Element)的setAttribute()方法設(shè)置style屬性：

var testdiv = document.getElementById("testdiv");
testdiv.setAttribute("style", "font-size:34px;color:red;");

除了IE(Microsoft Internet Explorer)，這種方法在當(dāng)前其它瀏覽器上都行得通。為了照顧IE，我們可以使用設(shè)置不標(biāo)準(zhǔn)的屬性---元素style對象的cssText屬性。盡管這個屬性不是標(biāo)準(zhǔn)的，但得到了廣泛的支持(除了Opera)：

var testdiv = document.getElementById("testdiv");
testdiv.style.cssText = "font-size:34px;color:red;";

• Firefox等瀏覽器：運行代碼，在下面的測試區(qū)域查看效果。
• Firefox等瀏覽器IE瀏覽器：，在下面的測試區(qū)域查看效果。

2. 設(shè)置元素的class屬性

使用Firefox和Safari之類的瀏覽器，可以通過元素(Element)的setAttribute()方法設(shè)置class屬性：

var testdiv = document.getElementById("testdiv");
testdiv.setAttribute("class", "HeaderBar");

為了照顧IE這個異類，它只認(rèn)識className屬性---在IE中className = class，其它大多數(shù)瀏覽器都忽略className屬性。你可以這樣做：

var testdiv = document.getElementById("testdiv");
testdiv.setAttribute("class", "HeaderBar");
testdiv.setAttribute("className", "HeaderBar");

• Firefox等瀏覽器：運行代碼，在下面的測試區(qū)域查看效果。
• Firefox等瀏覽器IE瀏覽器：運行代碼，在下面的測試區(qū)域查看效果。

上面的代碼已經(jīng)在Mozilla Firefox 1.5.0.2，Opera 8.54，Konqueror 3.5.2測試通過。

3. 創(chuàng)建輸入元素

注意document.createElement()和<Element>.setAttribute()方法的順序：

var button = document.createElement("input");
button.setAttribute("type", "submit");
var testdiv = document.getElementById("testdiv").appendChild(button);

• Firefox等瀏覽器和IE瀏覽器：運行代碼，在測試區(qū)域查看效果。

4. 向元素增加事件處理

標(biāo)準(zhǔn)的做法是：

var testdiv = document.getElementById("testdiv");
testdiv.setAttribute("onclick", "doFoo();");

除了IE，上面的代碼在所有的當(dāng)前瀏覽器中都能工作。在IE中必須使用點詞法來引用所需的事件處理程序：

var testdiv = document.getElementById("testdiv");
testdiv.onclick = function(){doFoo();};