Breaking News: Grepper is joining You.com. Read the official announcement!

js DOM siblings

Enchanting Echidna answered on February 3, 2022 Popularity 10/10 Helpfulness 4/10

answer js DOM siblings

js DOM siblings

Comment

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>JavaScript Siblings</title>
</head>
<body>
    <ul id="menu">
        <li>Home</li>
        <li>Products</li>
        <li class="current">Customer Support</li>
        <li>Careers</li>
        <li>Investors</li>
        <li>News</li>
        <li>About Us</li>
    </ul>
    
    <script>
        let getSiblings = function (e) {
            // for collecting siblings
            let siblings = []; 
            // if no parent, return no sibling
            if(!e.parentNode) {
                return siblings;
            }
            // first child of the parent node
            let sibling  = e.parentNode.firstChild;
            // collecting siblings
            while (sibling) {
                if (sibling.nodeType === 1 && sibling !== e) {
                    siblings.push(sibling);
                }
                sibling = sibling.nextSibling;
            }
            return siblings;
        };

        let siblings = getSiblings(document.querySelector('.current'));
        siblingText = siblings.map(e => e.innerHTML);
        console.log(siblingText);
    </script>
</body>
</html>
Code language: HTML, XML (xml)

Popularity 10/10 Helpfulness 4/10 Language javascript

Source: www.javascripttutorial.net

Tags: dom javascript siblings

Link to this answer
Share Copy Link

Contributed on Feb 03 2022

Enchanting Echidna

0 Answers Avg Quality 2/10

js DOM siblings

Contents

More Related Answers

js DOM siblings

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.