通过具体的元素节点调用
方法，返回当前节点的指定标签名后代节点
getElementByTagName()
1.属性，表示当前节点的所有子节点(会获取包括文本节点在内的所有子节点)，在IE8及以下的浏览器中，不会将空白文本当成子节点：
childNodes
2.属性，是获取当前元素下的所有子元素 这样就不会再包括空白文档：
children
3.属性表示当前节点的第一个子节点：
firstChild
4.属性表示当前节点的最后一个子节点：
lastChild
基本代码片段
<body>
<div class="left">
<div >
你喜欢那个城市
<ul id="city">
<li id="bj">北京</li>
<li>上海</li>
<li>新加坡</li>
<li>首尔</li>
</ul>
</div>
<div class="chosen">
你喜欢那个游戏
<ul>
<li>象棋</li>
<li>斗地主</li>
<li>极品飞车</li>
<li>红警</li>
</ul>
</div>
<div class="chosen">
你的性别：
<input type="radio" name="gender" value="man">男
<input type="radio" name="gender" value="wman" class="a">女
</div>
<div class="chosen">
姓名：<input type="text">
</div>
</div>
<div></div><button id="btn04">获取id="city"下所有子节点</button></div>
</div>
<script>
var btn04=document.getElementById("btn04");
</script>
</body>
获取元素节点
<script>
var cities =document.getElementByTagName("li");
//alert(cities)
//alert(cities.length)
for (var k=0;k<cities.length;k++) {
var all=cities[k].innerHTML
alert(all)
}
</script>
1.返回City所有子节点,childNodes
btn05.onclick = function(){
var cityChild = city.childNodes
alert(cityChild.length);
}
2.返回City所有子节点,children
btn05.onclick = function(){
var cityChild2 = city.children;
alert(cityChild2.length);
}
网友评论