DISCUSSION AND DOM TASK

DISCUSSION :

Today we have discuss about hoisting concept:
Hoisting means call the function before the function declaration. Hoisting works only on the function declaration.
In Normal variable declaration if we print the variable without declaration 1st means it give the "reference error or uncaught error"
suppose if we use var datatype for the variable declare after the print statement it give Undefined.

Today DOM Task:

CRUD OPERATION IN DOM:

   <h1 id="helo">welcome</h1>
    <script>
        document.getElementById("helo").remove();
        console.log(name.innerText);
        const create=document.createElement("p");
        create.innerText=" hii everyone !!!!"
        document.body.appendChild(create);
        const create1=document.createElement("h2");
        create1.innerText="bye!!!"
        document.body.appendChild(create1);
        const but = document.createElement("button");
        but.innerText="click me!";
        document.body.appendChild(but);
    </script>

output:

TASK 2:

   <h1 id="hi">HII</h1>
    <h1 id="helo">hello</h1>
    <h2 id="h2"></h2>

    <button  onclick="click1()">click me!!</button>
    <script>
       const hii=document.getElementById("hi")

       const hello=document.getElementById("helo")
       const world=document.getElementById("h2")

       function click1(){
        const new1 = document.getElementById("h2");
        new1.innerText="hello world";
        console.log(new1);
        world.insertBefore(hello,world.children[1])
       }
    </script>

output:

TASK 3:


    <h2 id="one">1</h2>
    <h2 id="two">2</h2>
    <h2 id="three">3</h2>
    <h2 id="four">4</h2>
    <input id="user" type="text">
    <button onclick="del1()">DELETE</button>
    <script>
        const num=document.getElementById("user");
        const array=document.querySelectorAll("h2");
        function del1(){
            const index=Number(num.value)-1;
            if(index>=0 && index<array.length){
                array[index].remove();
            }else{
                const err=document.createElement("p");
                err.innerText="out of Bound";
                document.body.appendChild(err);
            }
        }
    </script>

output: