JS

 avatar
unknown
plain_text
2 years ago
15 kB
9
Indexable
/////////////////////////////////Lab1////////////////////////////
<html> 

<body>

<h2>What Can JavaScript Do?</h2>

<p id="demo">JavaScript can change HTML content.</p>

<button type="button" onclick='document.getElementById("demo").innerHTML ="Hello JavaScript!"'>Click Me!</button> 
</body>
</html>
------------------------------------------------
<html>

<body>

    <h2>What Can JavaScript Do?</h2>

    <p>JavaScript can change HTML attribute values.</p>

        <p>In this case JavaScript changes the value of the src (source) attribute of
            an image.</p>

        <button onclick="document.getElementById('myImage').src='pic_bulbon.gif'">Turn
            on the light</button>

        <img id="myImage" src="pic_bulboff.gif" style="width:18px">

        <button onclick="document.getElementById('myImage').src='pic_bulboff.gif'">Turn
            off the light</button>

</body>

</html>
-------------------------------------------------------

<html> 
<body>

    <h2>What Can JavaScript Do?</h2>

    <p id="demo">JavaScript can change the style of an HTML element.</p>
    <button type="button" onclick="document.getElementById('demo').style.fontSize='35px'">Click Me!
    </button>

</body>

</html>
-------------------------------------------------------------
<html> 

<body>

    <h2>What Can JavaScript Do?</h2>

    <p id="demo">JavaScript can hide HTML elements. </p>

    <button type="button" onclick="document.getElementById('demo').style.display='none'">Click Me!
    </button>

</body>

</html>
--------------------------------------------------------------------
<html> 

<body>

    <h2>What Can JavaScript Do?</h2>

    <p>JavaScript can show hidden HTML elements.</p>

    <p id="demo" style="display:none">Hello JavaScript! </p>

    <button type="button" onclick=" document.getElementById('demo').style.display='block'">Click Me!
</button>

</body>

</html>

////////////////////////////////Lab2/////////////////////////////////////////
<html>

<head>
    <script>
        function myFunction() {
            document.getElementById("demo").innerHTML = "Paragraph changed";
        }
    </script>
</head>

<body>
    <h2>Demo JavaScript in Head</h2>
    <p id="demo">A Paragraph. </p>
    <button type="button" onclick="myFunction()">Try it</button>
</body>

</html>
----------------------------------------
<html>

<body>
    <h2>Demo JavaScript in Body</h2>
    <p id="demo">A Paragraph.</p>
    <button type="button" onclick=" myFunction()">Try it</button>
    <script>
        function myFunction() {
            document.getElementById("demo").innerHTML = "Paragraph changed.";}
    </script>
</body>

</html>
---------------------------------
<html>

<body>

    <h2>External JavaScript</h2>

    <p id="demo">A Paragraph.</p>

    <button type="button" onclick=" myFunction()">Click Me</button>
    <p>This example uses a full web URL to link to "myScript.js".</p>
    <p>(myFunction is stored in "myScript.js")</p>

    <script src="https://www.w3schools.com/js/myScript.js"></script>
</body>

</html>
/////////////////////////////////////////////////Lab3/////////////////////////////
<html>

<body>

    <h2> First Web Page</h2>

        <p>first paragraph.</p>

            <p> call document.write after the 
                </p>
                <script>

                    document.write(5 + 6);

                </script>

</body>

</html>
-----------------------------------------
<html>

<body>

    <h2>My First Web Page</h2>

    <p> First Paragraph.</p>

        <p id="demo"></p>

        <script>

            document.getElementById("demo").innerHTML = 5 + 6;
        </script>

</body>

</html>
-----------------------------------------------
<html>

<body>

    <h2>My First Web Page</h2>
    <p> first paragraph.</p>
        <script>

            window.alert(5 + 6);
        </script>

</body>

</html>
---------------------------------------------
<html>

<body>

    <h2>Activate Debugging </h2>

            <p>F12 on your keyboard will activate debugging. </p>
            <p>Then select "Console" in the debugger menu.</p>
            <p>Then click Run again.</p>

            <script>

                console.log(5 + 6);

            </script>

</body>

</html>
//////////////////////////////////////Lab4/////////////////////////
<html> 
<body>

    

    <p id="demo"></p>

    <script>

        var x, y, z; 

        x = 5;
        y = 6;
        z = x + y;
        document.getElementById("demo").innerHTML ="Z " + z+".";

    </script>

</body>

</html>
-----------------------------------------------------
<html>

<body>

    <h2>JavaScript Numbers</h2>

    <p>Number can be written </p>
    <p id="demo"></p>
 
    <script>

        document.getElementById("demo").innerHTML = 10.50;
    </script>

</body>

</html>
-----------------------------------------------
<html>

<h2>JavaScript </h2>

<p>Strings can be written with double .</p>
<p id="demo"></p>

<script>

    document.getElementById("demo").innerHTML = 'John Doe';
</script>

</body>
</html>
-----------------------------------------------
<html> 
<body>

    <h2>JavaScript Variables</h2>

    <p>In this example, x is defined as a variable.
        Then, x is assigned the value of 6:</p>
    <p id="demo"></p>

    <script>

        let x;

        x = 6;

        document.getElementById("demo").innerHTML = x;

    </script>

</body>

</html>
---------------------------------------------
<html>

<body>

    <h2> Operators</h2>

    <p>JavaScript uses arithmet
    </p>

    <p id="demo"></p> 
    <script>

    document.getElementById("demo").innerHTML = (5 + 6) * 10;

    </script>

</body>

</html>
------------------------------------------------------
<html> 

<body>

    <h2>Assigning  </h2>

    <p>In JavaScript the = operator.</p>
    <p id="demo"></p> 
    <script>

        let x, y;
        x=5;
        y=6;

        document.getElementById("demo").innerHTML = x + y;
    </script>

</body>

</html>
--------------------------------------------------------------
<html>

<body>

    <h2> Expressions</h2>

    <p>Expressions c.</p>

    <p id="demo"></p>

    <script>

        document.getElementById("demo").innerHTML = 5 * 10;
    </script>

</body>

</html>
---------------------------------------------------
<html>

<body>

    <h2> Expressions</h2>

    <p>Expressions  to .</p>

    <p id="demo"></p>

    <script>

        document.getElementById("demo").innerHTML ="John" +" "+"Doe";
    </script>

</body>

</html>
---------------------------------------------------
<html>

<body>

    <h2> Expressions</h2>
    <p>Expressions  to .</p>
    <p id="demo"></p>

    <script>

        var x;

        x = 5;

        document.getElementById("demo").innerHTML = x * 10;
    </script>

</body>

</html>
--------------------------------------------------
<html> 

<body>

    <h2>    Variables</h2>
    <p id="demo"></p>

    <script>

        var x, y;

        x = 5 + 6;

        y = x * 10;

        document.getElementById("demo").innerHTML = y;
    </script>

</body>

</html>
----------------------------------------------------
<html>

<body>

    <h2>JavaScript Comments are NOT Executed</h2>
    <p id="demo"></p>

    <script>

        let x;

        x = 5;

        // x = 6;

        document.getElementById("demo").innerHTML = x;
    </script>

</body>

</html>
------------------------------------------------------
<html>

<body>
    <h2> Case Sensitive</h2>

        



        <p>to change lastName to lastname.</p>
            <p id="demo"></p>
            <script>
                let lastname, lastName;
                lastName = "Doe";
                lastname = "Peterson";
                document.getElementById("demo").innerHTML = lastName;
            </script>
</body>

</html>
/////////////////////////////////////////////Lab5//////////////////////////////////////
<html>

<body>

    <h2> Statements</h2>

    <p>In HIML, JavaScript </p>
    <p id="demo"></p>

    <script>

        document.getElementById("demo").inmerHTML = "Hello Dolly.";
    </script>

</body>

</html>
-------------------------------------------
<html>

<body>

<h2>JavaScript Statements</h2>

<p>A <b>JavaScript program</b> is a list of <b>statements</b> to be executed by
a computer.</p>

<p id="demo"></p>

<script>

let x, y, z; 
x = 5 ;
y= 6 ;

z=x+y; 

document. getElementById("demo").innerHTML =
"The value of z is "+z +".";

</script>

</body>

</html>
------------------------------------------------------
<html>

<body>

<h2>JavaScript Statements</h2>

<p>JavaScript statements are separated by </p>
<p id="demol"></p>

<script>

let a, b;

a=5;

b= 6;

c=a+b;

document.getElementById("demol").innerHTML = c;
</script>

</body>

</html>
------------------------------------------------------
<html>

<body>

<h2> Statements</h2>

<p>Multiple statements  allowed</p>
<p id="demol"></p>

<script>

let a, b, c;

a=5; b= 6; c=a+b;

document.getElementById("demol").innerHTML = c;
</script>

</body>

</html>
---------------------------------------------------------
<html>
<body>
<h2>JavaScript Statements</h2>
<p>JavaScript code blocks are written between { and }</p>
<button type="button" onclick="myFunction()">Click Me!</button>
<p id="demo1"></p>
<p id="demo2"></p>
<script>

function myFunction() {
  document.getElementById("demo1").innerHTML = "Hello Dolly!";
  document.getElementById("demo2").innerHTML = "How are you?";
}
</script>


</body>
</html>
------------------------------------------------------------
<html> 
<body>

<h2>JavaScript Statements</h2>

<p>

The best place to break 
</p>

<p id="demo"></p>

<script>

document.getElementById("demo").innerHTML =
"Hello Dolly!";

</script>

</body>

</html>
//////////////////////////////////////////Lab6/////////////////////////////////

<html>
<body> 
  <h1 id="myH"></h1>
  <p id="myP"></p>
  <script>
  
  
  
  document.getElementById("myH").innerHTML = "JavaScript Comments";

  
  document.getElementById("myP").innerHTML = "My first paragraph.";
  
  </script>
  </body>
  </html>
---------------------------------------------------------------

<html>
  <body>
    <h2>JavaScript </h2>
    <p id="demo"></p> 
    <script>
    let x = 5 ;
    let y=x+2; 
    
    document. getElementById("demo").innerHTML = y;
    </script>
    </body>
  </html>
-----------------------------------------------------------------

<html>
  <body>
  <h1 id="myH"></h1>
    <p id="myP"></p>
    <script>
    /*test
    test
    */
    document.getElementById("myH").innerHTML = "JavaScript Comments";
    document.getElementById("myP").innerHTML = "My first paragraph";
    </script>
    </body>
  </html>
-------------------------------------------------------------------------------------------------------

<html>
  <body>
    <h2>JavaScript Comments</h2>
    <h1 id="myH"></h1> 
    
    <p id="myP"></p>
    
   
    <script>
    
    //document. getElementById("myH").innerHTML = "My First Page";
    document.getElementById("myP").innerHTML = "My first paragraph";
    </script>
    <p>The line starting with // is not execute</p>
    </body>
    </html>
--------------------------------------------------------------------------------------------------
<html>  
<body>
<h2>JavaScript </h2> 
<h1 id="myH"></h1> 
<p id="myP"></p>
<script>

/*
document.getElementById("myH").innerHTML = "Welcome ";
document.getElementById("myP").innerHTML = "This is .";
*/

document. getElementById("myP").innerHTML = "The comment-block is not executed. ";
</script>
</body>
</html>
//////////////////////////////////Lab7/////////////////////////////////////////////////
<html>  
<body>
  <h1> Variables</h1>

    <p>In this example, x, y, and z are variables.</p>
    <p id="demo"></p>
    
    <script>
    
    var x = 5;
    
    var y = 6;
    
    var z= x + y;
    document. getElementById("demo").innerHTML ="The value of z is: " + z;
    
    </script>
    
</body>
</html>
--------------------------------------------------------------------------
<html>

<body>
<h1>JavaScript Variables</h1>

<p>In this example, price, price2,    .</p> 
<p id="demo"></p>

<script> 

const pricel = 5;

const price2 = 6;

let total = pricel + price2;

document. getElementById("demo").innerHTML =
"The total is: "+ total;

</script>

</body>

</html>

-------------------------------------------------------------------------------------------------
<html> 

<body> 
<h1>Variables</h1>

<p>Strings are written with quotes.</p> 
<p>Numbers are written without quotes.</p>

<p id="demo"></p> 
<script>

const pi = 3.14; 

let person = "John Doe"; 

let answer = 'Yes I am!';

document .getElementById("demo").innerHTML = pi+ "<br>" + person + "<br>" + answer;
</script>

</body>

</html>
-------------------------------------------------------------------

<html>
<body>

<h1> Variables</h1>

<p>Create a variable,  it:</p>

<p id="demo"></p>

<script>
let carName = "Volvo";
document.getElementById("demo").innerHTML = carName;
</script>

</body>
</html>
--------------------------------------------------------------------
<html>

<body>

<h1> Variables</h1>

<p>You can declare many variables in one .</p>
<p id="demo"></p>

<script>

let person = "John Doe", carName = "Volvo", price = 208;
document. getElementById("demo").innerHTML = carName;
</script>

</body>

</html>
-----------------------------------------------------------------------
<html>

<body>

<h1> Variables</h1>

<p>You can declare many variables in  .</p>
<p id="demo"></p>

<script>

let person = "John Doe",
carName = "Volvo",

price = 200;

document.getElementById("demo").innerHTML = carName;
</script>

</body>

</html>
----------------------------------------------------------------
<html>

<body>

<h1> Variables</h1>

<p>The result of adding 5 + 2 + 3 </p>
<p id="demo"></p>

<script>

let x =5 +2+ 3;

document. getElementById("demo").innerHTML = x;
</script>

</body>

</html>
----------------------------------------------------
<html>

<body>

<h1>JavaScript Variables</h1>
<p>The result of adding "John" + "Doe"</p>
<p id="demo"></p>

<script>

let x = "John" +" " + "Doe";
document.getElementById("demo").innerHTML = x;
</script>

</body>

</html>
-------------------------------------------------
<html>

<body>

<h1> Variables</h1>

<p>The result of adding "5" + 2 + 3 is:</p>
<p id="demo" ></p>

<script>

let x = "5" +2 +3;

document. getElementById("demo").innerHTML = x;
</script>

</body>

</html>
------------------------------------------------------



Editor is loading...