js中本身封装一个IE8兼容的方法 去获取节点

使用nodeType判断某个节点是否是元素节点

先给你们简单介绍一下，查找节点的几种方法

var box=document.getElementsByClassName('box')[0];
console.dir(box);

console.log(box.parentNode) ;//指的就是box的父节点
console.log(box.childNodes) ;//box的全部子节点。
console.log(box.children) ;//全部元素子节点，不兼容IE8

console.log(box.previousSibling)//box的哥哥节点（就是上个节点）若是哥哥节点不存在，返回值为null
console.log(box.previousElementSibling)//box哥哥元素节点，若不存在返回值为null

console.log(box.nextSibling)//box的弟弟节点
console.log(box.nextElementSibling)//box弟弟元素节点
复制代码

本身封装一个IE8兼容的方法，能够获取哥哥节点

function getBroEle(ele) {
    // 获取ele的哥哥节点，而后判断是不是元素节点，不是的话，接着向上查找
    var bro = ele.previousSibling;
    while(bro && bro.nodeType !== 1 ){
        // 哥哥节点存在，而且不是元素节点,紧接着像上查找
        bro =bro.previousSibling;
    }
    return bro;
}
var res2=getBroEle(box);
console.log(res2)
复制代码

本身封装一个IE8兼容的方法，能够获取弟弟节点(同哥哥节点)

function getBroEle(ele) {
    // 获取ele的弟弟节点，而后判断是不是元素节点，不是的话，接着向上查找
    var bro = ele.nextSibling;
    while(bro && bro.nodeType !== 1 ){
        // 哥哥节点存在，而且不是元素节点,紧接着像上查找
        bro =bro.nextSibling;
    }
    return bro;
}
var res3=getBroEle(box);
console.log(res3)    
复制代码

本身封装一个方法，能够获取某个元素下的全部元素子节点

function getChildren(ele){
    // 从childNodes中筛选出元素子节点便可
    var ary=[];
    for(var i=0;i<ele.childNodes.length;i++){
        if(ele.childNodes[i].nodeType == 1 ){
            ary.push(ele.childNodes[i])
        }
    }
    return ary;
}
var res =getChildren(box);
console.log(res)     
复制代码

大概几种方法都给你们封装好了，剩下的估计你们也能明白其中原理吧。