JS
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...