對(duì)節(jié)點(diǎn)的增刪改查
查看元素節(jié)點(diǎn)
- document代表整個(gè)文檔
- document.getElementById() //元素id 在Ie8以下的瀏覽器涮雷，不區(qū)分id大小寫葬项，而且也返回匹配name屬性的元素
- .getElementsByTagName() // 標(biāo)簽名，最常用
- getElementsByName(); //梧却，IE不支持需注意奇颠，只有部分標(biāo)簽name可生效（表單，表單元素放航，img烈拒，iframe）
- .getElementsByClassName() // 類名 -> ie8和ie8以下的ie版本中沒有，可以多個(gè)class一起
- .querySelector() // css選擇器 在ie7和ie7以下的版本中沒有三椿，不實(shí)時(shí)缺菌，所以基本不用
- .querySelectorAll() // css選擇器 在ie7和ie7以下的版本中沒有，不實(shí)時(shí)搜锰，所以基本不用
基于元素節(jié)點(diǎn)樹的遍歷
- parentElement - > 返回當(dāng)前元素的父元素節(jié)點(diǎn)（IE不兼容）
- children -> 只返回當(dāng)前元素的元素子節(jié)點(diǎn)
- node.childElementCount === node.children.length 當(dāng)前元素節(jié)點(diǎn)的子元素節(jié)點(diǎn)的個(gè)數(shù)（IE不兼容）
- firstElementChild -> 返回的是第一個(gè)子元素節(jié)點(diǎn)（IE不兼容）
- lastElementChild -> 返回的是最后一個(gè)子元素節(jié)點(diǎn)（IE不兼容）
- nextElementSibling/previousElementSibling - > 返回后一個(gè)/前一個(gè)兄弟元素節(jié)點(diǎn)（IE不兼容）
遍歷節(jié)點(diǎn)樹
parentNode - > 父節(jié)點(diǎn)（最頂端的parentNode 為 #document）
childNode -> 子節(jié)點(diǎn)們
firstChild -> 第一個(gè)子節(jié)點(diǎn)
lastChild -> 最后一個(gè)子節(jié)點(diǎn)
nextSibling -> 后一個(gè)兄弟節(jié)點(diǎn)
previousSibling -> 前一個(gè)兄弟節(jié)點(diǎn)
節(jié)點(diǎn)的類型
- 元素節(jié)點(diǎn) --- 1
- 屬性節(jié)點(diǎn) --- 2
- 文本節(jié)點(diǎn) --- 3
- 注釋節(jié)點(diǎn) --- 8
- document --- 9
- DocumentFragment --- 11
nodeType -> 獲取節(jié)點(diǎn)類型
Element節(jié)點(diǎn)的一些屬性
innerHTML
innerText(火狐不兼容) / textContent(老版本IE不好使)
Element節(jié)點(diǎn)的一些方法
ele.setAttribute()
ele.getAttribute();
