Web API （排他思想）（自定義屬性） （節點操做）

一 、排他思想 

 

(1)概念 ：幹掉全部的 ，留下本身  

 

(2)用法 ：先要遍歷元素的集合 ，而後把全部元素設置樣式爲空 ，再把當前的元素設爲高亮。

 

(3)代碼 ：

 

 

 

二 、自定義屬性操做 

(1)獲取自定義屬性 ：element .getAttribute（屬性名）；

 

(2)設置自定義屬性 ：element .setAttribute（屬性名，屬性值）；

(3)移除自定義屬性 ：element .removeAttribute（屬性名）；

(4)H5中操做自定義屬性 ：在H5建議自定義屬性用date開頭 ；  方便咱們去進行獲取element .dataset.屬性名 ；

 

3、節點操做 

節點概述：至少擁有nodeType(節點類型) 、nodeName(節點名稱) 、nodeValue(節點值)三個基本屬性

1 、獲取節點 

(1）獲取父子節點 ：

獲取父節點 ：element . parentNode ；

獲取子元素 ：element . children ；

獲取子節點 :   element . childNodes ;

獲取第一個   子節點 | 元素  ：element . firstchild ；|   element . firstElementchild  ；

獲取最後一個    子節點  |  子元素  ：element . lastchild ; |  element . lastElementchild ;

(2)獲取兄弟節點  

獲取上一個    兄弟節點 |  元素  ：element . previousSibling ；|   element . previousElementSibling ；

獲取下一個    兄弟節點 |  元素  ：element . nextSibling  ； |   element . .nextElementSibling ；

代碼 ：

 

 

2 、動態添加節點 

(1)element . innerHTML ="    "   ;

(2)建立元素而後添加 ：

　　　　　　　　建立元素 ：var  li =document . createElement（'  li  '）//  僅僅只是在內存中   ；

　　　　　　　　掛載到DOM樹 ：parent . appendChild (li)  追加子元素   ；|   　　parent . insertBefore   (li ，參照的元素)  ；

DOM樹 ：