子节点的操作

来源:互联网 发布:网络磕是什么意思 编辑:程序博客网 时间:2024/05/30 23:47
描述:开始、最后、前一、后一节点操作
        开始节点:     firstElementChild、firstChild
最后节点: lastElementChild、lastChild
下一节点: nextElementSibling、nextSibling
上一节点: previousElementSibling、previousSibling
 
         (注意:前者在IE6~IE8不支持并且只获取元素节点,后者会获取文本节点,所以设计程序时要作处理)

   操作:函数封装,鼠标移动背景色:蓝红蓝走动

兼容性代码,首先需要判断是否存在首节点,尾节点

    function  firstNode(obj){
    //兼容
    if (!obj.firstChild) {
    return false;
    }
      return  obj.firstElementChild||obj.firstChild;
    }

function  lastNode(obj){
    if (!obj.lastChild) {
    return false;
    }
return  obj.lastElementChild || obj.lastChild;
}


function   preNode(obj){
    if (!obj.previousSibling) {
    return false;
    }
return  obj.previousElementSibling ||(obj.previousSibling.nodeType==1?obj.previousSibling:preNode(obj.previousSibling));
}

function nextNode(obj){
    if (!obj.nextSibling) {
    return false;
    }
return  obj.nextElementSibling ||(obj.nextSibling.nodeType==1?obj.nextSibling:nextNode(obj.nextSibling));
}

0 0
原创粉丝点击