Scribd
Upload
5 views8 pages

Web Technology Unit 4

The document provides an overview of key JavaScript concepts including conditional statements (if, if...else, switch), functions, loops (for, while, do...while), the window object, and form validation. Each section includes syntax and examples to illustrate how these features work in practice. It serves as a foundational guide for understanding JavaScript programming basics.

Uploaded by

pragathiswaranpsk
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views8 pages

Web Technology Unit 4

The document provides an overview of key JavaScript concepts including conditional statements (if, if...else, switch), functions, loops (for, while, do...while), the window object, and form validation. Each section includes syntax and examples to illustrate how these features work in practice. It serves as a foundational guide for understanding JavaScript programming basics.

Uploaded by

pragathiswaranpsk
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 8

1) Conditional Statements :

In JavaScript we have the following conditional statements:

 if statement - use this statement to execute some code only if a specified condition is true.
 if...else statement - use this statement to execute some code if the condition is true and
another code if the condition is false.
 if...else if....else statement - use this statement to select one of many blocks of code to be
executed.
 switch statement - use this statement to select one of many blocks of code to be executed

If Statement:

Use the if statement to execute some code only if a specified condition is true.

Syntax:

if (condition)

code to be executed if condition is true

If...else Statement:

Use the if....else statement to execute some code if a condition is true and another code if the condition
is not true.

Syntax:

if (condition)

code to be executed if condition is true

else

code to be executed if condition is not true

}
Example:

<script type="text/javascript">

var d = new Date();

var time = d.getHours();

if (time < 10)

document.write("Good morning!");

else

document.write("Good day!");

</script>

The JavaScript Switch Statement:

Use the switch statement to select one of many blocks of code to be executed.

Syntax:

switch(n)

case 1:

execute code block 1

break;

case 2:

execute code block 2

break;

default:
code to be executed if n is different from case 1 and 2

2) JavaScript Functions :
 A function contains code that will be executed by an event or by a call to the function.
 User can call a function from anywhere within a page (or even from other pages if the function is
embedded in an external .js file).

How to Define a Function:

Syntax:

function functionname(var1,var2,...,varX)

some code

The parameters var1, var2, etc. are variables or values passed into the function. The { and the } defines
the start and end of the function.

JavaScript Function Example:

Example:

<html>

<head>

<script type="text/javascript">

function displaymessage()

alert("Hello World!");

</script>

</head>
<body>

<form>

<input type="button" value="Click me!" onclick="displaymessage()" /> </form>

</body>

</html>

3) JavaScript Loops:
 The same block of code to run over and over again in a row.
 It is Used to repeatedly run a set of instruction while a given condition is true or false.
 In JavaScript, there are two different kind of loops:
1. for - loops through a block of code a specified number of times
2. while - loops through a block of code while a specified condition is true

The for Loop:

The for loop is used when you know in advance how many times the script should run.

Syntax:

for (variable=startvalue;variable<=endvalue;variable=variable+increment)

code to be executed

The example below defines a loop that starts with i=0. The loop will continue to run as long as i is less
than, or equal to 5. i will increase by 1 each time the loop runs.

Example:

<html>

<body>

<script type="text/javascript">

var i=0;

for (i=0;i<=5;i++)
{

document.write("The number is " + i);

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

</script>

</body>

</html>

JavaScript While Loop:

 Loops execute a block of code a specified number of times, or while a specified condition is true.
 The while loop, loops through a block of code while a specified condition is true.

Syntax:

while (variable<=endvalue)

code to be executed

The example below defines a loop that starts with i=0. The loop will continue to run as long as i is less
than, or equal to 5. i will increase by 1 each time the loop runs:

Example:

<html>

<body>

<script type="text/javascript">

var i=0;

while (i<=5)

document.write("The number is " + i);

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

</script>

</body>

</html>

The do...while Loop:

 The do...while loop is a variant of the while loop.


 This loop will execute the block of code ONCE, and then it will repeat the loop as long as the
specified condition is true.
 The do...while loop will always be executed at least once, even if the condition is false, because
the statements are executed before the condition is tested:

Syntax:

do

code to be executed

while (variable<=endvalue);

Example:

<html>

<body>

<script type="text/javascript">

var i=0;

do

document.write("The number is " + i);

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

i++;
}

while (i<=5);

</script>

</body>

</html>

4) Window Object :
 Window object is a top-level object in Client-Side JavaScript.
 Window object represents the browser's window.
 It represents an open window in a browser.
 The document object is a property of the window object. ...
 All global variables are properties and functions are methods of the window object.
 The following table lists important properties of Window Object.

Windows object Properties :

1. Document - It returns the document object for the window (DOM).


2. Frames - It returns an array of all the frames including iframes in the current window.
3. History - It returns the history object for the window.
4. Location - It returns the location object for the window.
5. Name - It sets or returns the name of a window.
6. Navigator - It returns the navigator object for the window.
7. Status - It sets the text in the status bar of a window.

Window Object Methods:

1. alert() - It displays an alert box.


2. confirm() - It displays a dialog box.
3. prompt() - It displays a dialog box that prompts the visitor for input.
4. setInterval() - It calls a function or evaluates an expression at specified intervals.
5. setTimeout() - It evaluates an expression after a specified number of milliseconds.
6. clearInterval() - It clears a timer specified by setInterval().
7. clearTimeOut() - It clears a timer specified by setTimeout().
8. close() - It closes the current window.
9. open() - It opens a new browser window.
10. createPopup() - It creates a pop-up window.
5) JavaScript Form Validation:
HTML form validation can be done by JavaScript. If a form field (fname) is empty, this function alerts a
message, and returns false, to prevent the form from being submitted:

JavaScript Example:

function validateForm()

var x = document.forms["myForm"]["fname"].value;

if (x == "")

alert("Name must be filled out");

return false;

The function can be called when the form is submitted:

HTML Form Example:

<form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post">

Name: <input type="text" name="fname">

<input type="submit" value="Submit">

</form>

You might also like