P84

操作元素樣式

獲取行內(nèi)樣式方法

?標(biāo)簽對(duì)象.style.CSS屬性名 = "CSS屬性值"

多個(gè)單詞賦值的屬性名去掉-連接起來，第一個(gè)之后的單詞首字母大寫，或通過["css屬性名"]

獲取內(nèi)部，外部，行內(nèi)樣式

getComputedStyle

可以獲取樣式，但不能賦值樣式

兼容

// ie 低版本 currentStyle.css屬性名

P85

操作元素類名

.className

修改：重新賦值 不會(huì)進(jìn)行檢測(cè)

.classList

增加：classList.add("類名")

刪除：classList.remove("類名")

切換：classList.toggle("類名")

P88

DOM節(jié)點(diǎn)

三大類：元素節(jié)點(diǎn)/文本節(jié)點(diǎn)/屬性節(jié)點(diǎn)

1. 通過getElementBy獲取到的都是元素節(jié)點(diǎn)
2. 通過getAttribute 獲取到的都是屬性節(jié)點(diǎn)
3. 通過innerText獲取到的就是文本節(jié)點(diǎn)

Document 根節(jié)點(diǎn)

html 元素節(jié)點(diǎn) 根元素節(jié)點(diǎn)

屬性節(jié)點(diǎn)沒有父子關(guān)系

注釋內(nèi)容也屬于節(jié)點(diǎn)，注釋節(jié)點(diǎn)

P89

獲取節(jié)點(diǎn)的方式

• .childNodes 獲取所有子節(jié)點(diǎn) 包括空白節(jié)點(diǎn)
• .children 獲取所有元素字節(jié)點(diǎn) 不包括空白節(jié)點(diǎn)
• .firstChild?獲取第一個(gè)子節(jié)點(diǎn)
• .firstElementChild? 獲取第一個(gè)元素子節(jié)點(diǎn)
• .lastChild??獲取最后一個(gè)子節(jié)點(diǎn)
• .lastElementChild 獲取第一個(gè)元素子節(jié)點(diǎn)
• .previousSibling 獲取前一個(gè)兄弟節(jié)點(diǎn)?
• .previousElementSibling? 獲取前一個(gè)兄弟元素節(jié)點(diǎn)
• .nextSibling 獲取后一個(gè)兄弟節(jié)點(diǎn)
• .nextElementSibling?獲取后一個(gè)兄弟元素節(jié)點(diǎn)
• parentNode/parentElement 獲取父節(jié)點(diǎn)
• attribute 獲取屬性節(jié)點(diǎn)