Scribd
Upload
25 views

Web Programs Part 2..

Html programs for beginners

Uploaded by

lifesmp7
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
25 views

Web Programs Part 2..

Html programs for beginners

Uploaded by

lifesmp7
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/ 30

Program no: 13

Odd Or Even Using Javascript


Aim: Write a javascript program to check whether a number is Even or Odd using alert box.

Program:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript</h1>
<script>
var number = prompt ("Enter a number to find Odd or Even ","Type
your number here");
if (number % 2 == 0)
{
alert ("The number entered is even.");
}
else
{
alert ("The number entered is odd.");
}
</script>
</body>
</html>
Output
Program no :14

JavaScript Array Sum


Aim: Create javascript program find the sum of elements in an array .

Program:

<html>

<head>

<title>JavaScript Array Sum</title>

</head>

<body>

<h1>JavaScript Array Sum</h1>

<script>

var array = [1, 2, 3, 4, 5];

var sum=0;

for(var i=0; i<array.length;i++)

var sum = sum+array[i];

document.write("Sum of Values in an Array =",sum);

</script>

</body>

</html>
Output:
Program No: 15

Square Of Numbers
Aim: Create a user defined function square to find square of numbers from 1 to 10.

Program

<!DOCTYPE html>

<html>

<head>

<title>A User-Defined square Function</title>

<style type = "text/css">

margin: 0;

</style>

<script>

document.write( "<h1>Square the numbers from 1 to 10</h1>" );

for (var x = 1; x <= 10; ++x)

document.write( "<p>The square of " +x+ " is " +square(x)+ "</p>" );

function square (y)

return y * y;

</script>

</head>

<body>

<! -- empty body element -->

</body>

</html>
Output:
Program No:16

Prompt Dialog Box


Aim: Write a javascript code to show prompt dialog box.

Program:

<html>

<head>

<script>

function login()

var name = prompt ("Enter your UserName");

if(name!=null)

document.write("<h2><center>Welcome. "+name +"</center></h2>");

else

document.write("<h2><center>Please Enter Your Name</center></h2>");

</script>

</head>

<body>

<center>

<h1> Crayambal Inc </h1>

<p> Please Login to View Details </p>

<form>

<input type = "button" value = "Login" onclick = "login()" >

</form>

</center>

</body>
</html>
Output:
Program No:17

Form Validation
Aim: Create JavaScript code to validate a form created using HTML

Program:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8" >

<title>Form Validation</title>

</head>

<body>

<h1>REGISTRATION FORM</h1>

<form name="RegForm" onsubmit="validateForm()" autocomplete="on">

<label for="name">Name:</label>

<input type="text" id="name" name="Name" placeholder="Enter your full name" >

<p>

<label for="email">E-mail Address:</label>

<input type="text" id="email" name="EMail" placeholder="Enter your email correctly" >

</p>

<p>

<label for="password">Password:</label>

<input type="password" id="password" name="Password" >

</p>

<p>

<input type="checkbox" id="agree" name="Agree" >

<label for="agree">I agree to the above information</label>

</p>

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

<input type="reset" value="Reset" name="Reset" >

</form>
<script>

function validateForm()

var name = document.getElementById("name").value;

var email = document.getElementById("email").value;

var password = document.getElementById("password").value;

var agree = document.getElementById("agree").checked;

var isValid = true;

if (name == "")

alert( "Please enter your name.");

isValid = false;

if (email == "" || !email.includes("@"))

alert("Please enter your email correctly.");

isValid = false;

if (password == "" || password.length < 6)

alert("Please enter your password correctly.");

isValid = false;

if (!agree)

alert("Please agree to the above information.");

isValid = false;

if(isValid)

document.write(" Form Submitted Successfully");


}

</script>

</body>

</html>
Output:
Program No:18

Mouseclick Event
Aim: Write a javascript code to show Mouseclick Event.

Program:

<html>

<head>

<title>Mouseclickevent</title>

</head>

<body>

<h3>Javascript Events </h3>

<script language="Javascript" type="text/Javascript">

function clickevent()

document.write("Hello World");

</script>

<form>

<input type="button" onclick="clickevent()" value="Click"/>

</form>

</body>

</html>
OUTPUT:
Program No:19

Reverse A Number
Aim: Write a javascript code to Reverse a number.

Program:

<html>

<title>Reverse a number</title>

<script type ="text/javascript">

function rev_num()

var num = prompt("Enter the number to be reveresed :", " ");

var n= num;

var rev = 0, rem;

while (n>0)

rem = n % 10;

rev = rev * 10 + rem ;

n = Math.floor(n/10);

document.write("The given number is : " +num+ " <br/> The reversed number is : "
+rev+"\n");

</script>

<body onload="rev_num();">

<body>

</html>
Output:
Program No:20

Factorial
Aim: Write a javascript program to find the factorial of a numbers.

Program:

<html>

<head>

<title> Factorial </title>

<script type="text/javascript">

function factorial()

var n,i,f=1;

n=prompt("Enter Number");

for(i=1;i<=n;i++)

f=f*i;

document.write("Factorial="+f);

</script>

</head>

<body>

<p>Click the following button to call the function</p>

<form>

<input type="button" onclick="factorial()" value="Factorial">

</form>

</body>

</html>
OUTPUT:
Program No:21

Sum Of Array Using HTML, Javascript And CSS As Separate

External Files
Aim: Create a website to calculate sum of array using HTML, Javascript and CSS as separate external
files.

Program:

array.html

<html>

<body>

<link rel="stylesheet" href="style.css">

<h1> JavaScript Array Sum </h1>

<script src="sum.js"></script>

</body>

</html>

style.css

body {
background-color: black;
}

h1 {
color: #000;
font-family: Arial, Helvetica, sans-serif;
}
sum.js

var number=[1,2,5,2];
var sum=0;
for(var i=0;i<number.length;i++)
{
sum+=number[i];
}
document.write(number);
document.write("<br>The sum of above numbers are:"+sum);
OUTPUT:
Program No:22

XML
Aim: Display an XML tree structure of a bookstore.

Program:

Bookstore.xml

<?xml version="1.0" encoding="UTF-8"?>

<!—Bookstore Data structured with XML -->

<bookstore>

<book category="fiction">

<title>Harry Potter</title>

<author>J.K. Rowling</author>

<year>2005</year>

<price>29.99</price>

</book>

<book category="non-fiction">

<title>Introduction to XML</title>

<author>John Doe</author>

<year>2010</year>

<price>39.95</price>

</book>

</bookstore>
OUTPUT:

You might also like