JavaScript——封装返回元素兄弟元素节点的函数

最新推荐文章于 2022-10-24 08:46:10 发布

lvh98

最新推荐文章于 2022-10-24 08:46:10 发布

阅读量343

点赞数

分类专栏： JavaScript小练习文章标签：大数据

本文链接：https://blog.csdn.net/lvh98/article/details/125650639

版权

JavaScript小练习专栏收录该内容

8 篇文章 0 订阅

订阅专栏

封装返回元素兄弟元素节点的函数

封装函数，返回元素elem的第n个兄弟元素节点，n为正，返回后面的兄弟元素节点，n为负，则返回前面的，n为0，返回自己。

想要取得元素的兄弟元素节点，需要使用nextElementSibling和previousElementSibling

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        <span></span>
        <strong></strong>
        <b></b>
        <div></div>
        <p></p>
    </div>
    <script>
        function retSibling(elem, n){
            if(n > 0){
                while(elem && n){
                    elem = elem.nextElementSibling;
                    n --;
                }
            }else{
                while(elem && n){
                    elem = elem.previousElementSibling;
                    n ++;
                }
            }
            return elem;
        }
    </script>
</body>
</html>

retElementSibling

函数如下：

function retSibling(elem, n){
    if(n > 0){
        while(elem && n){
            elem = elem.nextElementSibling;
            n --;
        }
    }else{
        while(elem && n){
            elem = elem.previousElementSibling;
            n ++;
        }
    }
    return elem;
}

或

function retSibling(elem, n){
	while(elem && n){
        if(n > 0){
            elem = elem.nextElementSibling;
            n --;
        }else{
            elem = elem.previousElementSibling;
            n ++;
        }
    }
    return elem;
}

若考虑兼容性

function retSibling(elem, n){
	while(elem && n){
        if(n > 0){
            if(elem.nextElementSibling){
                elem = elem.nextElementSibling;
            }else{
                for(elem = elem.nextSibling; elem && elem.nodeType != 1; elem = elem.nextSibling);
            }
            n --;
        }else{
            if(elem.previousElementSibling){
                elem = elem.previousElementSibling;
            }else{
                for(elem = elem.previousSibling; elem && elem.nodeType != 1; elem = elem.previousSibling);
            }
            n ++;
        }
    }
    return elem;
}