# CSS-DOM
- <a href="#no1">9.1 三位一體的網頁</a>
- <a href="#no2">9.2 style 屬性</a>
- <a href="#no3">9.3 何時該用DOM腳本設置樣式</a>
- <a href="#no4">9.4 className 屬性</a>
- <a href="#no5">9.5 小結</a>
**本章內容**
- style 屬性
- 如何檢索樣式
- 如何改變樣式
##<a name="no1">9.1 三位一體的網頁</a>
- 結構層
- 表示層
- 行為層
###9.1.1 結構層
> 網頁的結構層由HTML或XHTML之類的標記語言負責創建。標簽，也就是那些出現在尖括號里的單詞，對網頁內容的語義含義做出了描述。
###9.1.2 表示層
> 表示層由CSS負責完成。
###9.1.3 行為層
> 行為層負責內容應該如何響應事件這一問題。這是`JavaScript`語言和`DOM`主宰的領域。
###9.1.4 分離
- 使用(X)HTML去大件文檔的結構；
- 使用CSS去設置文檔的呈現效果；
- 使用DOM腳本去實現文檔的行為。
##<a name="no2">9.2 style 屬性</a>
> 文檔中的每個元素都有一個對象，每個對象又有著各種各樣的屬性。
###9.2.1 獲取樣式
element.style.styleName
###9.2.2 設置樣式
element.style.property = value
##<a name="no3">9.3 何時該用DOM腳本設置樣式</a>
###9.3.1 根據元素在節點樹里的位置來設置樣式
> 略
###9.3.2 根據某種條件反復設置某種樣式
> 略
###9.3.3 響應事件
> 略
##<a name="no4">9.4 className 屬性</a>
element.className
#
**新增 class**
function addClass(element, value){
if(!element.className){
element.className = value;
}else{
newClassName = element.className;
newClassName += '';
nawClassName += value;
element.className = newClassName;
}
}
##<a name="no5">9.5 小結</a>
- (讀)寫style對象的各種屬性
- className 屬性
