下面写个例子来获取id为demo的元素的第一个子元素。
<!--加载jquery--><script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script>
$(function(){//页面加载完成时进入
var firstChild=$("#demo>:first")//用选择器的方式获取第一个子元素
firstChild.css('color','red')//将第一个子元素中的文字变为红色，可以看到只有“111”是红色的
})
</script>
<div id="demo"><span>111</span><span>222</span><span>333</span></div>
说明一下以上例子中用到选择器
#demo是id选择器获取id为demo的元素
>是子选择器获取所有子级
:first是首项选择器获取第一个元素
三者结合起来就是获取id为demo的元素的所有子元素中的第一个元素。
其实jquery的选择器有很多，包括：
:last获取最后一个元素
:eq(index)获取第index个选择器
更多可以直接百度搜索“jquery选择器”来查看。
<script>var father=document.getElementById("father")
var div=father.getElementsByTagName("div")[0]
a()
function a(){
var ary=[]
var b=div.nextElementSibling
while (b){
ary.push(b)
b=b.nextElementSibling
}
console.log(ary)
}
</script>
在获取子元素之前js肯定不知道总共有多少个子元素，所以子元素都是以元素集合的形式出现的（即使子元素只有一个甚至没有），然后再从中枚举出每个子元素，比如：elem.childNodes[0] //这是第一个子元素
elem.childNodes[1] //这是第二个子元素，依此类推
此外，还可以使用children，它也是个集合，用法一样：
elem.children[0] //这是第一个子元素
elem.children[1] //这是第二个子元素，依此类推
childNodes和children的区别在于，前者会把文本元素（含回车、空格等）也作为子元素，后这则只把标签元素作为子元素
此外，如果知道子元素的ID、Name、Class或者标签名，也可以直接获取子元素，比如：
elem.getElementById("abc") //获取id为abc的子元素（ID具有唯一性，所以它可以直接获取）
elem.getElementsByName("xxx")[0] //获取name属性为xxx的第一个子元素（name属性允许重名，所以它是个集合）
elem.getElementsByClassName("hehe")[0] //获取class为hehe的第一个子元素（class属性也是可以重名的）
elem.getElementsByTagName("a")[0] //获取第一个a标签子元素
