Scribd
Upload
27 views

Labs - Lab Manual 11

JavaScript is a scripting language that adds interactivity to HTML pages. It is embedded directly into HTML and allows scripts to execute without compilation. JavaScript is case sensitive and uses statements, code, and variables to tell the browser what to do. Common event handlers in JavaScript include alerts, confirmations, and pop-ups.

Uploaded by

MahmoodAbdul-Rahman
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
27 views

Labs - Lab Manual 11

JavaScript is a scripting language that adds interactivity to HTML pages. It is embedded directly into HTML and allows scripts to execute without compilation. JavaScript is case sensitive and uses statements, code, and variables to tell the browser what to do. Common event handlers in JavaScript include alerts, confirmations, and pop-ups.

Uploaded by

MahmoodAbdul-Rahman
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Lab Manual

Lab # 11
What is JavaScript?
 JavaScript was designed to add interactivity to HTML pages
 JavaScript is a scripting language
 A scripting language is a lightweight programming language
 JavaScript is usually embedded directly into HTML pages
 JavaScript is an interpreted language (means that scripts execute without preliminary compilation)
 Everyone can use JavaScript without purchasing a license

Start End Tag:


<script type="text/javascript">

</script>

JavaScript is Case Sensitive


Unlike HTML, JavaScript is case sensitive - therefore watch your capitalization closely when you write JavaScript
statements, create or call variables, objects and functions.

JavaScript Statements
A JavaScript statement is a command to a browser. The purpose of the command is to tell the browser what to do.

This JavaScript statement tells the browser to write "Hello " to the web page:

document.write("Hello ");

It is normal to add a semicolon at the end of each executable statement. Most people think this is a good
programming practice, and most often you will see this in JavaScript examples on the web.

The semicolon is optional (according to the JavaScript standard), and the browser is supposed to interpret the end
of the line as the end of the statement. Because of this you will often see examples without the semicolon at the
end.

JavaScript Code
JavaScript code (or just JavaScript) is a sequence of JavaScript statements.

Each statement is executed by the browser in the sequence they are written .
Example:
<html>

<body>

<script type="text/javascript">

document.write("<h1>This is a heading</h1>");

document.write("<p>This is a paragraph.</p>");

document.write("<p>This is another paragraph.</p>");

</script>

</body>

</html>

JavaScript Variables
Example:
<html>

<body>

<script type="text/javascript">

var firstname;

firstname="Hege";

document.write(firstname);

document.write("<br />");

firstname="Tove";

document.write(firstname);

</script>

<p>The script above declares a variable, assigns a value to it, displays the value, changes the value, and
displays the value again.</p>

</body>

</html>
Event Handler

1. Alert:
<form>
<input type="button" onclick=

"alert('Are you sure you want to give us the deed to your house?')"

value="Confirmation Alert">

</form>

2. Confirm
<html>
<head>
<script type="text/javascript">

<!--

function confirmation() {

var answer = confirm("Leave abc.com?")

if (answer){

alert("Bye bye!")

window.location = "http://www.google.com/";

else{

alert("Thanks for sticking around!")

//-->

</script>

</head>

<body>

<form>

<input type="button" onclick="confirmation()" value="Leave abc.com">


</form>

</body>
</html>

3. Pop Up:
<head>

<script type="text/javascript">

<!--

function myPopup() {

window.open( "http://www.google.com/" )

//-->

</script>

</head>

<body>

<form>

<input type="button" onClick="myPopup()" value="POP!">

</form>

<p onClick="myPopup()">CLICK ME TOO!</p>

</body>

Summery Example:
<html>

<head>

<script type="text/javascript">

function displayDate()

document.getElementById("demo").innerHTML=Date();
}

</script>

</head>

<body>

<h1>My First Web Page</h1>

<p id="demo">This is a paragraph.</p>

<button type="button" onclick="displayDate()">Display Date</button>

</body>

</html>

Lab Task:
Page 1:

Page2:

Make it sure that the information is confirmed.

You might also like