javascript practise havard.

Lecture 5 - CS50's Web Programming with Python and JavaScript (harvard.edu) 


@{

    ViewData["Title"] = "Home Page";

}


<head>

    <h1>HELLO</h1>

    <p1>0</p1>

    <script>

        //alert

        alert('Hello, SATHI PLEASE DO NOT MISS USE OUR WEB APPLICATION. otherwise ill find you and ill kill you!')

    </script>

    <button onclick="callEvent()">Click Here</button>

    <button onclick="count()">Click to count</button>

    <button class="btn1">Click to count imp</button> @*onclick="google()"*@

    <button onclick="goodbye()">EXIT</button>

</head>



<form>

        <input autofocus id="name" placeholder="Name" type="text">

        <input type="submit">

</form>


<div class="raj">

<select autofocus placeholder="watches" id="watches" class = "selector"

    type="text">

    <option value="none">0</option>

      <option value="Institutional">1</option>

      <option value="Individual">2</option>    

    </select>

</div>

<script>

        function callEvent()

        {

            //onlick funtion

            alert('k xa sathi thik xa ni sabai')


            //variables in java script

            //var age=20 -- var used to define variable globally

            //let used to define a variable that is limited in scope to the 

            //current block such as funtion or loop

            // let counter=1

            //const:used to define a value that will not change. in short it

            //cant be over-ride

            //const PI = 3.14

};


        var counter = 0;


        function count()

        {

            counter++;

            alert(counter);


};

       //document.queryselector --selects particular html tag

        function goodbye()

    let vari = document.querySelector('h1');

            if (vari.innerHTML === 'HELLO')  //REMEMBER THIS OPERATOR

            {

               vari.innerHTML='La yar sathi janu paryo ramro sanga basa hai!!'; 

            }

    

           //if (vari.innerHTML == 'La yar sathi janu paryo ramro sanga basa hai!!') 

           else if (vari.innerHTML === 'La yar sathi janu paryo ramro sanga basa hai!!')

           {

               vari.innerHTML = 'Hyaterika matokne bilkul';

            }

            else

            {

                vari.innerHTML = '<u>sorry i cant understand this !!</u><button onclick="google()"> Click to count imp</button>';

            }

           

};


//lets use dom manipulation to make our counter funtion better

            var gog = 0;

            function google()

            {

                let cnt = document.querySelector("p1"); //note dom manipulation is possible onlhy in p1, h1 like 1 2 3 etc

                gog++;

                cnt.innerHTML = gog;


                if (gog % 10 == 0) { 

                  alert(`count is ${gog}`) //remember this string interpolation

                }

                //document.querySelector('p1').innerHTML = gog;

}

document.addEventListener('DOMContentLoaded', function()

{

    document.querySelector(".btn1").onclick = google; //remember onclick is all lower case

     

    });


document.addEventListener('DOMContentLoaded', function() {

            document.querySelector('form').onsubmit = function() {

                const name = document.querySelector('#name').value;

                alert(`Hello, ${name}`);

            };

        });


        document.addEventListener('DOMContentLoaded', function() {

            document.querySelector('.selector').onchange = function() {

                const name = document.querySelector('#watches');

                alert(name.value);

                if (name.value === 'Individual') {

                    let con = document.querySelector('.raj');

                    con.innerHTML = '<form><input autofocus id="name" placeholder="Name" type="text"><input type="submit"></form>';

                }


                if (name.value === 'Institutional') {

                    let con = document.querySelector('.raj');

                    con.innerHTML = '<form><input autofocus id="name" placeholder="Wife Name" type="text"><input type="submit"></form>';

                }

                

                

                //alert(select.selectedOptions[0].innerHTML);


            };

        });

</script>

Comments