獲取DOM元素
-
獲取DOM元素
-
格式：
document.querySelector(選擇器) //返回指定選擇器中的第一個元素 document.querySelectorAll(選擇器)[索引] //返回指定選擇器中的所有元素的偽數(shù)組
-
獲取指定元素節(jié)點的子元素
元素.children：返回指定元素節(jié)點中的所有子元素元素.firstElementChild：返回指定元素節(jié)點中第一個子元素元素.lastElementChild：返回指定元素節(jié)點中最后一個子元素元素.previousElementSibling：返回指定元素節(jié)點前一個相鄰元素元素.nextElementSibling：返回指定元素節(jié)點后一個相鄰元素-
格式：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <ul id="UL"> <li>我是第1個li</li> <li>我是第2個li</li> <li>我是第3個li</li> </ul> <script> let oDiv = document.querySelector("#UL"); //返回指定元素中的所有子元素 console.log(oDiv.children); //返回指定元素中的所有子節(jié)點 console.log(oDiv.childNodes); //逐個遍歷子節(jié)點 for (let node of oDiv.childNodes) { //nodeType返回節(jié)點類型，包括節(jié)點（返回1）、屬性（返回2）汇四、文本（返回3） //節(jié)點類型常量Node.ELEMENT_NODE=1 if (node.nodeType === Node.ELEMENT_NODE) console.log(node); } </script> </body> </html>
-
獲取指定元素節(jié)點的子節(jié)點
節(jié)點的概念：DOM其實是文檔對象模型，本質(zhì)是一棵樹网棍，節(jié)點包含元素節(jié)點（1）、屬性（2）妇智、文本（3）
元素.childNodes：返回指定元素節(jié)點中的所有子節(jié)點元素.firstChild：返回指定元素節(jié)點中第一個子節(jié)點元素.lastChild：返回指定元素節(jié)點中最后一個子節(jié)點元素.previousSibling：返回指定元素節(jié)點前一個相鄰節(jié)點元素.nextSibling：返回指定元素節(jié)點后一個相鄰節(jié)點-
獲取指定元素父元素或父節(jié)點（兼容寫法）：
let parentEle = oDiv.parentElement || oDiv.parentNode;
