節(jié)點(diǎn)
1）一共12個(gè)節(jié)點(diǎn)類(lèi)型
2）dom操作就是對(duì)節(jié)點(diǎn)進(jìn)行操作
3）節(jié)點(diǎn)的類(lèi)型的獲取方法notetype
4）ie9以上及chrome safari firefox 會(huì)將換行符當(dāng)成節(jié)點(diǎn)
var box=document.getElementsByClassName('box')[0];
console.log(box.nodeType);
1. getElementById()
1）靜態(tài)獲取
2）返回帶有指定ID的元素
var box1=document.getElementById('box');
2. getdocumentsByTagName()
1）根據(jù)標(biāo)簽名獲取
2）得到的是個(gè)數(shù)組
var div1=document.getElementsByTagName('div')[0];
3. getdocumentsByClassName()
1）根據(jù)類(lèi)名獲取元素
2）動(dòng)態(tài)獲取
3）得到的是一個(gè)數(shù)組
var box=document.getElementsByClassName('box')[0];
4. querySelector()
1）返回符合要求第一個(gè)元素
2）通過(guò)css選擇器來(lái)獲取指定標(biāo)簽
3）靜態(tài)獲取
5. querySelectorAll()
1）返回所有匹配元素
2）根據(jù)css選擇器來(lái)獲取所有標(biāo)簽
3）得到的是一個(gè)數(shù)組
6.1 nextSibling
獲取兄弟節(jié)點(diǎn)
7. nextElementSibling
獲取下一個(gè)兄弟標(biāo)簽
8. previousSibling
獲取上一個(gè)兄弟節(jié)點(diǎn)
9. previousElementSibling
獲取上一個(gè)兄弟標(biāo)簽
10. lastchild
獲取最后一個(gè)子節(jié)點(diǎn)
11. lastElementChild
獲取最后一個(gè)子標(biāo)簽
12. childNodes
獲取所有非標(biāo)簽類(lèi)型的子節(jié)點(diǎn)
13. children
獲取所有子標(biāo)簽節(jié)點(diǎn)
14. parentNode
獲取父節(jié)點(diǎn)
15. createElement
增加節(jié)點(diǎn)
var div=document.createElement('div');
16. appendChild
在父元素的末尾偏序，插入節(jié)點(diǎn)
在添加元素前幸乒，需要將元素先創(chuàng)建好
div.appendChild(div);
17. replaceChild(new,old)
修改指定子節(jié)點(diǎn)
18. removeChild()
刪除指定子節(jié)點(diǎn)
在刪除前需要先獲取到被刪除元素
div.removeChild(box);
19. remove()
刪除當(dāng)前節(jié)點(diǎn)
需要先獲取到被刪除的節(jié)點(diǎn)
div.remove();
屬性
1）設(shè)置ID
div.id='box';
2）設(shè)置class
div.className='box';
3）設(shè)置style
div.style.width='10px';
4）設(shè)置圖片路徑
img.src='../';
5）.自定義屬性
div.setAttribute(屬性名,屬性值);
div.getAttribute(屬性名);
