DOM Traversing in Javascript.

 HTML:-

 <div class="container">

        <h1 id="heading"> Welcome to Code With Harry</h1>

        <div id="myfirst" class="child red good" id="first">

            <ul>

                <li class="childul">this</li>

                <li class="childul">is</li>

                <li class="childul">a</li>

                <li class="childul">list </li>

                <li class="childul">of my dreams</li>

            </ul>

        </div>

        <div class="mycon">

            <ul>

            <li>home </li>

            <li>About </li>

            <li>Services </li>

            <li>Services 1</li>

            <li>Blog </li>

            <li>Contect Us </li>

        </ul>

        </div>

    </div>


Js:-

<script type="text/javascript">

console.log("This is Java Scripts Traversion")

const containerR = document.querySelector(".container");

console.log(containerR.children[1].children[0].children[4]);

                //or

console.log(containerR.children[2].children[0].children[3].nextElementSibling)    

const myFirst = document.querySelector("#myfirst");

console.log(myFirst.children[0].children[2]);    

</script>



No comments:

Post a Comment