html dom父節點，子節點，兄弟節點
阿新 • • 發佈：2018-12-26
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script type="text/javascript" src="js/write.js"></script> <script type="text/javascript"> function getNodeLevel() { //得到子節點 /*var oNode=document.getElementById("tabid"); var list=oNode.childNodes; alert(list[0].nodeName);*/ ////結果:tbody //得到父節點 /* var oNode=document.getElementById("tabid"); var oParentNode=oNode.parentNode; alert(oParentNode.nodeName); ////結果:body */ //子節點巢狀 /*var oNode=document.getElementById("tabid"); var list=oNode.childNodes; var ochildNode=list[0].childNodes; alert(ochildNode[0].nodeName);*/ //結果:tr //得到兄弟節點 var oNode=document.getElementById("tabid"); var oPnode=oNode.previousElementSibling; //左兄弟 var oNnode=oNode.nextElementSibling; //右兄弟 alert(oPnode.nodeName+":"+oNnode.nodeName); //結果:div:span } </script> <input type="button" value="獲取關係" onclick="getNodeLevel()"/> <div>行內封裝</div> <table id="tabid"><tbody><tr><td>123</td> </tr> </tbody> </table> <span>區域</span> </body> </html>