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 getNodeById() { //節點的獲取方式也分三種 //節點物件分三種，標籤，文字，屬性 //var oNode=document.getElementById("divid"); //1.通過id獲取 //節點的屬性一般有三個，節點的名字，節點的型別：標籤的型別為1，節點的值：標籤沒有值 // println(oNode.nodeName+":"+oNode.nodeType+":"+oNode.nodeValue); //println(oNode.innerHTML); //oNode.innerHTML="div的內容被我改變了"; println(document.getElementsByName("user")[0]); } function getNodeByName() { //2.通過name獲取,返回值是一個數組 var list=document.getElementsByName("user"); alert(list[0].nodeName+":"+list[0].type); //list[0].value="hahaha"; println(list[0].value); } function getNodeByTagName() { /*var aa=document.getElementsByTagName("a");alert(aa.length); for(var xx=0;xx<aa.length;xx++) { aa[xx].target="_blank"; }*/ // var aa=document.getElementById("news"); var aaa=aa.getElementsByTagName("a"); for(var xx=0;xx<aaa.length;xx++) { aaa[xx].target="_blank"; } } </script> <input name="user" type="text"/> <input type="button" onclick="getNodeByTagName()" value="通過標籤名獲取"/> <input type="button" value="通過id獲取document物件節點" onclick="getNodeById()"/> <input type="button" value="通過name獲取節點" onclick="getNodeByName()"/> <div id="divid">這是一個div區域</div> <a href="http://www.baidu.com">百度網站</a> <a href="http://www.sina.com">百度網站1</a> <div id="news"> <!--要求這裡面的用新視窗開啟--> <a href="http://www.baidu.com">百度網站2</a> <a href="http://www.sina.com">百度網站3</a> </div> </body> </html>