想必大家都知道jquery中有个children()是一个遍历的方法，作用是获取某个指定元素下所有子元素，那么今天我们来用原生JS实现一个这个children()，其实很简单，只不过需要处理一下IE678兼容的问题，大家都知道IE678是一个‘很标准的浏览器’对于前端人员来说，这可真是爽歪歪的浏览器啊，最喜欢IE678了。
好了，那咱们来实现下。
Title
window.onload = function () {
var odiv = document.getElementById('div');
var browser = /MSIE (6|7|8)/i.test(navigator.userAgent);
function children(curEle, tagName) {
var ary = [];
if (browser) {
var nodeList = curEle.childNodes;
for (var i = 0, len = nodeList.length; i < len; i++) {
var curNode = nodeList[i];
curNode.nodeType === 1 ? ary[ary.length] = curNode : null;
}
nodeList = null;
} else {
ary = Array.prototype.slice.call(curEle.children)
}
if (typeof tagName === "string") {
for (var k = 0; k < ary.length; k++) {
var curEleNode = ary[k];
if (curEleNode.nodeName.toLowerCase() !== tagName.toLowerCase()) {
ary.splice(k, 1);
k--;
}
}
}
return ary
}
alert(children(odiv,'div'))
console.log(children(odiv,'div'))
}
提示：你可以先修改部分代码再运行。
这里借用的是childNodes这个属性，基本上没有什么兼容上的问题，利用符合要求的就push进数组，然后进行二次筛选调用的时候
调用说明：
在console中查看数据
可以直接children(odiv)传入一个参数，实现找到odiv这个元素下所有的元素
还可以children(odiv,’div’)传入两个参数，实现找到odiv这个元素下所有div的元素
喜欢用原生JS的同学都应该知道js的函数是可以随便传入几个参数的，所以说传入一个或者两个，甚至三个都没问题的。就看你有没有那么多需求了。
原生JS实现JQuery children()方法就介绍到这里了，咱们下期见！
html获取孩子节点 JS实现JQuery children()方法 获取某个元素下所有子元素节点或者某个元素下指定标签元素 – Fakins Blog...
