節(jié)點(diǎn)
1）一共12個節(jié)點(diǎn)類型
2）dom操作就是對節(jié)點(diǎn)進(jìn)行操作
3）節(jié)點(diǎn)的類型的獲取方法noteType(nodeType是所有節(jié)點(diǎn)都有的屬性 ==》節(jié)點(diǎn)類型)
4）ie9以上及chrome safari firefox 會將換行符當(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）得到的是個數(shù)組
var div1=document.getElementsByTagName('div')[0];
3. getdocumentsByClassName()
1）根據(jù)類名獲取元素
2）動態(tài)獲取
3）得到的是一個數(shù)組
var box=document.getElementsByClassName('box')[0];
4. querySelector()
1）返回符合要求第一個元素
2）通過css選擇器來獲取指定標(biāo)簽
3）靜態(tài)獲取
var box=document.querySelector('.box');
5. querySelectorAll()
1）返回所有匹配元素
2）根據(jù)css選擇器來獲取所有標(biāo)簽
3）得到的是一個數(shù)組
var box=document.querySelectorAll('.box');
6.1 nextSibling
獲取兄弟節(jié)點(diǎn)
var box=box.nextSibling;
7. nextElementSibling
獲取下一個兄弟標(biāo)簽
8. previousSibling
獲取上一個兄弟節(jié)點(diǎn)
9. previousElementSibling
獲取上一個兄弟標(biāo)簽
10. lastchild
獲取最后一個子節(jié)點(diǎn)
11. lastElementChild
獲取最后一個子標(biāo)簽
12. childNodes
獲取所有非標(biāo)簽類型的子節(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(屬性名);
