使用classname屬性來指定結(jié)點的樣式
作者:佚名 時間:2014-02-07 分享到:
如何使用javascript對元素樣式進行完全的控制,但每指定一個屬性都需要對style的屬性賦一次值,這樣不僅代碼冗余很多,而且將外觀代碼整合到了程序之中,不利于修改和維護,而使用結(jié)點classname屬性來實現(xiàn)css控制可以避免這個問題.
結(jié)點的classname屬性對應(yīng)于標(biāo)記中的class屬性.結(jié)合css類型選擇器,可以實現(xiàn)指改變元素樣式的效果.如:
<select onchange="document.getelementbyid('div1').classname=this.value">
<option value="style1">選擇樣式</option>
<option value="style1">樣式一</option>
<option value="style2">樣式二</option>
</select>
在列表標(biāo)記中使用onchange事件來捕獲用戶選擇的樣式,并用classname來指定的樣式應(yīng)用到div上.
由此可見,使用javascript結(jié)合元素結(jié)點的classname屬性,可以將程序邏輯和表現(xiàn)邏輯分開,當(dāng)需要改變顯示效果時,只需要改變css的內(nèi)容即可,真正做到了表現(xiàn)和結(jié)構(gòu)的相分離.