2. it技术
  3. js dom操作 获取子节点的三种方式

js dom操作 获取子节点的三种方式

it2025-01-17  4
获取子节点的三种方式 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> window.onload = function(){ //查找#city下所有li节点 //方法1 var lis = document.getElementById("city").children; console.log(lis.length) //方法2 //对于 childNodes，需要使用nodetype 来判断 nodeType来判断是哪种类型的节点，只有当nodeType==1时才是元素节点，2是属性节点，3是文本节点 lis = document.getElementById("city").childNodes; for (var i=0;i<lis.length;i++) { if(lis[i].nodeType==1){ console.log(lis[i].innerHTML); } } //方法3 lis = document.getElementById("city").getElementsByTagName("li"); console.log(lis.length) }; </script> </head> <body> <div id="total"> <p> 你喜欢哪个城市? </p> <ul id="city"> <li id="bj">北京</li> <li>上海</li> <li>东京</li> <li>首尔</li> </ul> </div> </body> </html>
最新回复(0)