<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>遍历节点</title>
<script src="js/Jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function(){
var $body=$("body").children();
alert($body.length);//2(p元素和ul元素)
var $ul=$("ul").children();
alert($ul.length);//3
var $li=$("li").children();
alert($li.length)//0
//children()方法只考虑子元素（元素节点），不考虑隔代的子元素，也不考虑其他节点；
})
window.onload=function(){
var ul=document.getElementsByTagName("ul")[0];
var liarrN=ul.childNodes;
var liarrE=ul.children;
var bodyChildren=document.body.children;
alert("bodyChildren.length="+bodyChildren.length);//2（ul和p)
console.log(bodyChildren[0]);//p元素
console.log(bodyChildren[1]);//ul元素
alert(liarrN.length);//7（包括四个""文本节点）
alert(liarrE.length);//3（仅包括三个li节点）
//childNodes 属性返回所有的节点，包括文本节点、注释节点；children 属性只返回元素节点；
}
</script>
</head>
<body>
<p title="选择你最喜欢的水果.">你最喜欢的水果是？</p>
<ul>
<li title="苹果">苹果</li>
<li title="橘子">橘子</li>
<li title="菠萝">菠萝</li>
</ul>
</body>
</html>
3430
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
