DOM重點核心-基礎

 擷取元素有哪兩種方法方法？

1 利用DOM提供的方法擷取元素。

　　document.getElementbyId(),document.getELmenntbyTagName()

　　document,getElementsByClassName('')

　　document.querySelector(''),document.querySelectorAll()（+ ‘.','#',''）

2 利用 節點層級關系。擷取元素。 父子元素。（相容性較差，邏輯性強！！！）

節點有3中：元素節點。屬性節點。文位元組點。

我們在實際開發中，主要操作的是元素節點！

nodeName:

nodeType : 元素節點1，屬性節點2 ，文本節點3.

nodeValue:

3種關系節點：

父親節點：parentNode:

孩子節點：

1childNodes,  2 children。（實際開發經常使用！）

第一個元素節點：有3種寫法。

firstChild，firstElementChild，children[0]（第三個用多！）。

最後一個元素的寫法：有3種元素：

lastChild,lastElementChild, children[obecj.children.length -1 ])（第三個用的多）;

兄弟節點：

換行也是一個文本節點。

node.nextSibling,node.previousSibling

node.nextElementSibling,node.previousElementSibling

先建立，在添加。

建立節點：動态創節點的。

document.createElement('tagName')

添加節點：

第一種方法：node.appendChild(Child)；前面是node是父親，Child是孩子。

第二種方法：node.insertBefore(lili,ul.children[0]);

删除節點：

node.removeChild(child)删除父元素的子節點！

複制節點（克隆節點）：

node.cloneNode();

node.cloneNode(true)；為True；深拷貝，拷貝内容！

3種動态建立元素的

1. document.write()； 文檔流建立結束，文檔流執行完畢，則會導緻頁面全部重繪。

window.onload= function(){};頁面玩，記載完，調用。

2. element.innerHTML； 将内容寫入某個DOM節點，不會導緻全部重繪，

innerHTML建立多個元素效率更高，不要采用拼接字元串，采取數組形式拼接，那麼效率更高！

 inner.innerHTML += '<>百度</>'

3. document.createElement； 時間很快，效率很高！

var a =document. 

create.appendChild(a); ：建立結構很清晰。效率稍微低一些。

DOM重點核心：

建立： 1documen.write 2  innerHTML 3 createElement

增加： 1appendChild。 2 insertBefore

删：removeChild

改：修改dom元素屬性，内容，屬性，表單的值。

　　1.修改元素屬性： src，href，title

　　2. 修改普通元素内容:innerHTML,innerText。

　　3. 修改表單元素：value，type，disabled

　　4. 修改元素樣式：style，className

查：1DOM 古老使用： getElementByld，getElementByTagName

2 H5提供新方法，querySelector,querySelectorAll提倡。

3 利用節點操作擷取元素：parentNode，children，nextElementSibling提倡。

自定義屬性：儲存屬性。 

1 setAttribute。 2 getAttribute 。3 removeAttribute

事件操作：事件源，事件類型 = 事件處理程式。