DOM中获取元素的节点兼容IE6-8封装,带jquery源码分析children

时间:2021-12-04 03:22:32
<ul id="box">
<li>第一个节点</li>
<li>第二个节点</li>
<li>第三个节点</li>
<li>第四个节点</li>
</ul>
var box = document.getElementById('box');
//标准浏览器(非IE6-8)中会把空格和换行当做文本节点处理
console.log(box.childNodes); //NodeList(9) [text, li, text, li, text, li, text, li, text]
//如果只想要元素节点,但是IE6-8下使用children会把注释也当做元素节点
console.log(box.children);
//获取children指定上下文所有元素的子节点兼容IE6+所有浏览器
function children(context){
var res = [],nodeList = context.childNodes;
for(var i = 0;i<nodeList.length;i++){
var item = nodeList[i];
item.nodeType === 1 ? res.push(item):null;
}
return item;
}
console.log(children(box).length);