DOM 文檔對(duì)象模型荧琼，操作【獲取/新增插入/刪除/修改/復(fù)制/替換】文檔中的節(jié)點(diǎn)
節(jié)點(diǎn)：【node】
元素節(jié)點(diǎn)具则，文本節(jié)點(diǎn)衷咽，屬性節(jié)點(diǎn)狞换，注釋節(jié)點(diǎn)..
element.nodeType 1.
獲取元素節(jié)點(diǎn)：
1.document.getElementById();
document.getElementsByTagName();
document.getElementsByName();
document.getElementsByClassName();
document.querySelector(selector); 從IE8開始支持
document.querySelectorAll();
document.documentElement html元素
document.body body元素
document.head head元素
2、實(shí)時(shí)/非實(shí)時(shí)
實(shí)時(shí)DOM接口
document.getElemenstByTagName();
document.getElementsByName();//一般用來獲取表單元素
document.getElementsByClassName();//IE9開始支持
3裕坊、獲取元素節(jié)點(diǎn)的速度
ID>非實(shí)時(shí)>實(shí)時(shí)
4包竹、創(chuàng)建元素節(jié)點(diǎn)
document.createElement('ul')
5、需要找到插入元素節(jié)點(diǎn)的父級(jí)
parentNode.appendChild(node); 添加到末尾
parendNode.insertBefore(node, targetchildNode) 插入到某一個(gè)位置
6籍凝、元素中的獲取屬性/添加屬性/移除屬性
獲取屬性：ele.getAttribute(name)
設(shè)置屬性：ele,setAttribute(name,value)
移除屬性：ele.removeAttribue(name)
7周瞎、重繪重排 replain reflow
js優(yōu)化，DOM操作消耗性能饵蒂，盡可能減少DOM操作声诸，減少重繪重排
8、復(fù)制節(jié)點(diǎn)
node.cloneNode(false/true);
默認(rèn)false 淺復(fù)制退盯，不復(fù)制內(nèi)部元素
true 深復(fù)制彼乌，復(fù)制內(nèi)部元素
9、替換節(jié)點(diǎn)
node可以是新創(chuàng)建元素得问，也可以是存在在頁面上的元素
parentNode.replaceChild(node,replacedNode)
10囤攀、移除節(jié)點(diǎn)
parentNode.removeChild(node)
11、節(jié)點(diǎn)之間的關(guān)系
父子/兄弟
parentNode.children 獲取元素所有的子元素
parentNode.childNodes 獲取元素所有的子節(jié)點(diǎn)
parentNode.nextSibling 下一個(gè)兄弟節(jié)點(diǎn)
parentNode.nextElementSibling 獲取到的是下個(gè)兄弟元素
parentNode.previousSibling 上一個(gè)兄弟節(jié)點(diǎn)
parentNode..previousElementSibling 上一個(gè)兄弟元素
