获取元素节点的子节点
通过具体的元素节点调用
getElementByTagName():
方法，返回当前节点的指定标签名后代节点
childNodes:
属性，表示当前节点的所有子节点
firstChild：
属性，表示当前节点的第一个子节点
lastChild：
属性，表示当前节点的最后一个子节点
例子：
我要评论<ul id="city">
<li id="bj">北京</li>
<li>上海</li>
<li>东京</li>
<li>首尔</li>
</ul>
这时要返回#city 的所有节点
//首先为id为btn04 的按钮绑定一个单击响应函数
var btn04=document.getElementById("btn04");
btn04.onclick=function()
{
//获取id 为city的元素
var city=document.getElementById("city");
//查找#city 下的所有节点
var lis=city.getElementsByTagName("li");
for(var i=0;i<lis.length;i++){
alert(lis[i].innerHTML)；
}
}
//返回#city 的所有子节点
//为id 为btn05的按钮绑定一个单击响应函数
var btn05=document.getElementById("btn05");
btn05.onclick=function(){
//获取id 为city的节点
var city=document.getElementById("city");
//childNodes属性会获取包括文本节点在内的所有节点
//根据 dom 标签，标签中的空白也会当成是文本
//但是需要注意的是在IE8 以下的浏览器中，不会将空白文本当成子节点，所以该属性在IE8 中会返回4 个子元素而在别的浏览器中式返回9个
var cns=city.childNodes;
for(var i=0;i<cns.length;i++)
{
alert(cns[i]);
}
};
children 属性可以获取当前元素的所有子元素
var cns2=city.children;
alert(cns2.length);//这个更加符合我们的需求，也就是空格我们不再返回了
//返回#phone 的第一个子节点
为id为btn06 的按钮来帮顶一个单击响应函数
var btn06=document.getElementById("btn06");
btn06.onlick=function(){
//获取id 为phone 的元素
var phone =document.getElementById("phone");
//返回phone的第一个子节点
//firstChild可以获取到当前元素的第一个子节点(包括空白文本节点)
var fir=phone.firstElementChild;
//firstElementChild 可以获取当前元素的第一个子元素（也就是没有空格的情况）
//firstElementChild 不支持IE8 及以下的浏览器，如果要兼容的他们尽量不要使用
alert(fir);
};
本文地址：https://blog.csdn.net/yrhlyyouknow/article/details/107372817
如对本文有疑问， 点击进行留言回复！！
selenium + ajax抓取英雄联盟全部英雄的详细信息及多线程保存全部皮肤图片到本地
网友评论