JavaScript獲取相關節點
阿新 • • 發佈：2018-07-27
color 簽名 tel 標簽 節點類 name 相關 val 子元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="dv"> <span>這是div中的第一個span標簽</span> <p>這是div中的第二個元素,第一個p標簽</p> <ul id="uu"> <li>喬峰</li> <li>鹿茸</li> <li id="three">段譽</li> <li>卡卡西</li> <li>雛田</li> </ul> </div> <script src="common.js"></script> <script> var ulObj = my$("uu"); //ul標簽的父級節點 console.log(ulObj.parentNode);//ul標簽的父級元素 console.log(ulObj.parentElement); var divOBJ = my$("dv"); //div的子節點 console.log(divOBJ.childNodes); //div的子元素 console.log(divOBJ.children); //div var dvObj = document.getElementById("dv"); //獲取裏面的每個子節點 for (var i = 0; i < dvObj.childNodes.length; i++) {var node = dvObj.childNodes[i]; //nodeType:--->節點類型:1---標簽,2---屬性,3---文本 //nodeName:--->節點名字:大寫的標簽名----標簽,小寫的屬性名---屬性,#text---文本 //nodeValue:--->節點值:標簽---null,屬性---屬性的值,文本---文本內容 console.log(node.nodeType + "======" + node.nodeName + "======" + node.nodeValue) } //div var dv1Obj = document.getElementById("dv"); //獲取的是屬性的節點 var node1 = dv1Obj.getAttributeNode("id"); console.log(node1.nodeType + "======" + node1.nodeName + "======" + node1.nodeValue); </script> </body> </html>
JavaScript獲取相關節點