Scribd
Upload
8 views52 pages

Neha Web Techno All

The document contains a series of HTML programming exercises for a web technology and e-commerce course for the academic year 2022-2023. It includes tasks such as creating tables, lists, hyperlinks, frames, and forms, along with source code examples for each task. Each section is structured with a question followed by the corresponding HTML source code and expected output.

Uploaded by

artvibe92
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
8 views52 pages

Neha Web Techno All

The document contains a series of HTML programming exercises for a web technology and e-commerce course for the academic year 2022-2023. It includes tasks such as creating tables, lists, hyperlinks, frames, and forms, along with source code examples for each task. Each section is structured with a question followed by the corresponding HTML source code and expected output.

Uploaded by

artvibe92
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/ 52

WEB TECHNOLOGY AND E-COMMERCE 2022-2023

HTML
Q1.Write an HTML program to create the following table :
Class Subject 1 Subject 2 Subject 3
BCA I Visual Basic PC Software Electronics
BCA II C++ DBMS English
BCA III Java Multimedia CSA

SOURCE CODE:
<html>
<head>
<title> Table format </title>
</head>
<body>
<table border="1">
<tr>
<th> Class </th>
<th>Subject 1 </th>
<th> Subject 2 </th>
<th> Subject 3 </th>
</tr>
<tr>
<th> BCA I </th>
<th>Visual Basic </th>
<th> PC Software </th>

BCA 1 Neha Giri PAGE | 1


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<th> Electronics</th>
</tr>
<tr>
<th> BCA II</th>
<th>C++</th>
<th> DBMS </th>
<th> English</th>
</tr>
<tr>
<th>BCA III</th>
<th>Java</th>
<th> Multimedia</th>
<th> CSA</th>
</tr>
</table>
</body>
</html>OUTPUT:

Q2. Write an HTML program to create the following list:

BCA 1 Neha Giri PAGE | 2


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

(I) C
(II) C++
(III) Fortran
(IV) COBOL

SOURCE CODE:
<html>
<head><title> list format </title>
</head>
<body>
<ol type="I">
<li>C </li>
<li>C++ </li>
<li><pre> Fortran</pre></li>
<li><pre> COBOL</pre></li>
</ol>
</body>
</html>OUTPUT:

Q3. Write an HTML program to create the following list:


1. Java

BCA 1 Neha Giri PAGE | 3


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

2. Visual Basic
3. BASIC
4. COBOL

SOURCE CODE:
<html>
<head><title> list format </title>
</head>
<body>
<ol type="1">
<li> Java</li>
<li> Visual Basic </li>
<li> BASIC </li>
<li> COBOL </li>
</ol>
</body>
</html>OUTPUT:

Q4. Write an HTML program to demonstrate hyper linking between two web
pages. Create a marquee and also insert an image in the page.

BCA 1 Neha Giri PAGE | 4


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
First webpage:
<html>
<head><title> hyperlink format </title>
</head>
<body>
<h1><marquee>**WELCOME TO MY FIRST WEBPAGE**</marquee></h1>
<imgsrc="ray-hennessy.jpg" height="250" width="300">
<br><br>
<a href="second.html"><strong>CLICK HERE TO JUMP TO SECOND
WEBPAGE</strong></a>
</body>
</html>
OUTPUT:

Second webpage:
<!DOCTYPE html>

BCA 1 Neha Giri PAGE | 5


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<html>
<head><title> hyperlink</title>
</head>
<body>
<h1><marquee>**WELCOME TO MY SECOND WEBPAGE**</marquee></h1>
<img src="aaron-burden.jpg" height="250" width="300">
<br><br>
<a href="first.html"><strong>CLICK HERE TO JUMP TO FIRST
WEBPAGE</strong></a>
</body>
</html>
OUTPUT:

Q5. Write an HTML program to create frame in HTML with 3 column

(Width=30%, 30%, 40%)

BCA 1 Neha Giri PAGE | 6


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
<!DOCTYPE html>
<html>
<head><title> frame format </title>
</head>
<frameset cols="30%,40%,30%">
<frame name="FRAME1" src="first.html"/>
<frame name="FRAME2" src="second.html"/>
<frame name="FRAME3" src="third.html"/>
</frameset>
</html>
OUTPUT:

Q6. Write an HTML program to create a web page with a blue background and the
following text.
New Delhi

BCA 1 Neha Giri PAGE | 7


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

New Delhi, the capital and the third largest city of India is fusion of the ancient and the
modern. The refrain of the Muslim dynasties with its architectural delights, give the
majestic ambience of the bygone era.

SOURCE CODE:
<html>
<head><title>paragraph</title>
<body bgcolor=”blue”>
<i><u><h1 align="center" >New Delhi</h1></u>
<p>New Delhi, the capital and the third largest city of India is fusion of the ancient
and the modern. The refrain of the Muslim dynasties with its architectural
delights, give the majestic ambience of the bygone era. </p></i>
</body>
</html>
OUTPUT:

Q7. Write an HTML program to create the following table:


Admission

BCA 1 Neha Giri PAGE | 8


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Course OC BC MBC SC/ST TOTAL


Computer 9 18 5 5 37
science
Commerce 14 25 6 5 50
Grand total 87

SOURCE CODE:
<html>
<head><title> admission</title>
<body>
<u>
<h1>Admission
</h1></u>
<table border="1">
<tr>
<th>Course</th>
<th>OC</th>
<th>BC</th>
<th>MBC</th>
<th>C/ST</th>
<th>TOTAL</th>
</tr>
<tr>
<th>Computer science</th>
<td>9</td>

BCA 1 Neha Giri PAGE | 9


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<td>18</td>
<td>5</td>
<td>5</td>
<td>37</td>
</tr>
<tr>
<th>Commerce</th>
<td>14</td>
<td>25</td>
<td>6</td>
<td>5</td>
<td>50 </td>
</tr>
<tr>
<td colspan="5"><b>Grand total </b></td>
<td>87 </td>
</tr>
</body>
</head>
</html>

Q8. Write an HTML program to create the following table:


Car Price List

BCA 1 Neha Giri PAGE | 10


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Maruti Tata Ford


Model Price Model Price Model Price
Maruti 2 Lac Sumo 2 Lac Ikon 5 Lac
8000
Omni 3 Lac Scorpio 3 Lac Gen 2 Lac

SOURCE CODE:
<html>
<head><title> paragraph</title>
</head>
<body>
<u>
<h1 align="center" >Car Price List
</h1></u>
<table align="center" border="1" style="border-collapse: collapse;">
<tr>
<th colspan="2">Maruti</th>
<th colspan="2">Tata</th>
<th colspan="2">Ford</th>
</tr>
<tr>
<th>Model</th>
<th>Price</th>
<th>Model</th>
<th>Price</th>
<th>Model </th>

BCA 1 Neha Giri PAGE | 11


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<th>Price</th>
</tr>
<tr>
<td>Maruti 8000</td>
<td>2 Lac</td>
<td>Sumo</td>
<td>2 Lac</td>
<td>Ikon</td>
<td>5 Lac</td>
</tr>
<tr>
<td>Omni</td>
<td>3 Lac</td>
<td>Scorpio</td>
<td>3 Lac</td>
<td>Gen</td>
<td>2 Lac</td>
</tr>
</table>
</body>
</html>

Q9. Write the HTML program to create the following table:


Students Records

BCA 1 Neha Giri PAGE | 12


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Name Subject Marks


Arun Java 70
C 80
Ashish Java 75
C 69

SOURCE CODE:
<html>
<head><title>table</title>
</head>
<body>
<u>
<h1 align="center">Students Record
</h1></u>
<table align="center" border="1" style="border-collapse: collapse;">
<tr>
<th>Name</th>
<th>Subject</th>
<th>Marks</th>
</tr>
<tr>
<td>Arun</td>
<td>Java</td>
<td>70</td>
</tr>
<tr>

BCA 1 Neha Giri PAGE | 13


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<td></td>
<td>C</td>
<td>80</td>
</tr>
<tr>
<td>Ashish</td>
<td>Java</td>
<td>75</td>
</tr>
<tr>
<td></td>
<td>C</td>
<td>69</td>
</tr>
</table>
</body>
</html>

Q10. Create the HTML document and embed a flash movie in it.

BCA 1 Neha Giri PAGE | 14


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
<!DOCTYPE html>
<html>
<head><title> flash movies</title>
</head>
<body>
<h2>Welcome To Flash movies</h2>
<object width="500" height="400">
<param name="movie" value="car.swf">
<embed src="car.swf" width="500" height="400">
</embed>
</object>
</body>
</html>
OUTPUT:

Q11. Write the HTML coding to display the following table. Also insert an image
in the web page
Subject Max Min obtain

BCA 1 Neha Giri PAGE | 15


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Java 100 33 75
Multimedia 100 33 70
Operating 100 33 68
system
C++ 100 33 73

SOURCE CODE:
<!DOCTYPE html>
<html>
<head><title> Table format</title>
</head>
<body background="background.jpg"><u>
<h1 align="center" >Student records</h1></u>
<table align="center" border="1" style="border-collapse: collapse;">
<tr>
<th>Subject</th>
<th>Max</th>
<th>Min</th>
<th>obtain</th>
</tr>
<tr>
<td>Java </td>
<td>100</td>
<td>33</td>
<td>75</td>
</tr>

BCA 1 Neha Giri PAGE | 16


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<tr>
<td>Multimedia</td>
<td>100</td>
<td>33</td>
<td>70</td>
</tr>
<tr>
<td>Operating system</td>
<td>100</td>
<td>33</td>
<td>68</td>
</tr>
<tr>
<td> C++</td>
<td>100</td>
<td>33l</td>
<td>73</td>
</tr>
</table>
</body>
</html>

Q12. Write the HTML coding to display the following table


Name Rahul

BCA 1 Neha Giri PAGE | 17


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Roll no. 101


Subject Max Min Obtain
Java 100 33 75
Multimed 100 33 70
ia

SOURCE CODE:
<html>
<head><title> Table format</title>
</head>
<body>
<u>
<h1>Student records
</h1></u>
<table border="1" style="border-collapse: collapse;">
<tr>
<th colspan="2">Name</th>
<th colspan="2" >Rahul</th>
</tr>
<tr>
<th colspan="2">Roll No.</th>
<th colspan="2" >101</th>
</tr>
<tr>
<th> Subject</th>
<th>Max </th>
<th> Min</th>

BCA 1 Neha Giri PAGE | 18


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<th>Obtain </th>
</tr>
<tr>
<td> Java</td>
<td>100</td>
<td> 33</td>
<td>75</td>
</tr>
<tr>
<td> Multimedia</td>
<td>100</td>
<td> 33</td>
<td>70</td>
</tr>
</table>
</body>
</head>
</html>

Q13. Write an HTML program to create a form as the following:


Enter Name:
Enter Roll No:

BCA 1 Neha Giri PAGE | 19


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Enter Age:
Enter DOB:

SOURCE CODE:
<html>
<head>
<title>forms</title>
</head>
<body>
<form>
enter name: <input type="text" name="name"> <br> <br>
enter roll no: <input type="text" name="rollno"><br><br>
enter age: <input type="text" name="age"><br><br>
enter DOB: <input type="text" name="dob">
</form>
</body>
</html>

OUTPUT:

Q14. Write an HTML program to create a web page an image as background


and the following
New Delhi

BCA 1 Neha Giri PAGE | 20


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

New Delhi, the capital and the third largest city of India is fusion of the ancient and the
modern. The refrain of the Muslim dynasties with its architectural delights, give the majestic
ambience of the bygone era.
On the other side New Delhi, the imperial city built by British, reflect the first paced. The most
fascinating of all is the character of Delhi which varies from the 13th present century mausoleum of
the Lodi kings to ultra modern glass skyscrapers.

SOURCE CODE:
<!DOCTYPE html>
<html>
<head>
<title> paragraph</title>
</head>
<body background="ray-hennessy.jpg">
<h1 align="center" >
<u>New Delhi </u>
</h1>
<p>
New Delhi, the capital and the third largest city of India is fusion of the
ancient and the modern. The refrain of the Muslim dynasties with its
architectural delights, give the majestic ambience of the bygone era.
</p>
<p>
On the other side New Delhi, the imperial city built by British, reflect the first
paced. The most fascinating of all is the character of Delhi which varies from
the 13th present century mausoleum of the Lodi kings to ultra modern glass
skyscrapers.
</p>
</body>

BCA 1 Neha Giri PAGE | 21


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

</html>

OUTPUT:

Q15.Create the following HTML form.

BCA 1 Neha Giri PAGE | 22


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
<html>
<head>
<title>forms</title>
</head>
<body>
<form>
username: <input type="text" name="name">
<br>
<br>
password: <input type="password" name="rollno">
<br>
<br>
when user types characters in a password field,the browser displays asterisks or bullets
instead of characters
<br>
<br>

BCA 1 Neha Giri PAGE | 23


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<input type="button" name="submit" value="submit query">


</form>
</body>
</html>

OUTPUT:

Q16. Create the following HTML form.

BCA 1 Neha Giri PAGE | 24


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
<html>
<head>
<title>forms</title>
</head>
<body>
<form>
FIRSTNAME: <input type="text" name="fname"><br><br>
LASTNAME: <input type="text" name="lname"><br><br>
GENDER:<br>
male<input type="radio" name="gender" value="male">
female<input type="radio" name="gender" value="female"><br><br>
SUBJECTS:
<select name="subjects">
<option value="multimedia">multimedia</option>
<option value="operating_system">operating system</option>

BCA 1 Neha Giri PAGE | 25


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<option value="csa">CSA</option>
</select><br><br>
<input type="button" name="submit" value="submit query">
</form>
</body>
</html>

OUTPUT:

Q17. Create the following HTML form.

BCA 1 Neha Giri PAGE | 26


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
<html>
<head>
<title>forms</title>
</head>
<body>
<form>
enter your name: <input type="text" name="fname"><br><br>
enter your rollno: <input type="text" name="lname"><br><br>
SUBJECTS:<br>
<input type="checkbox" name="subject1" value="java">JAVA<br>
<input type="checkbox" name="subject2" value="c">C<br>
<input type="checkbox" name="subject3" value="VB">Visual Basic<br>
<input type="checkbox" name="subject4" value="c++">C++<br><br>

Class:
<select name="class">

BCA 1 Neha Giri PAGE | 27


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<option value="bca1">BCA1</option>
<option value="bca2">BCA2</option>
<option value="bca3">BCA3</option>
</select><br><br>
<input type="button" name="submit" value="submit query">
</form>
</body>
</html>

OUTPUT:

BCA 1 Neha Giri PAGE | 28


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

SOURCE CODE:
<!DOCTYPE html>
<head><title> list </title>
</head>
<body>
C<sub>2</sub>H<sub>5</sub>OH
+PCL<sub>5</sub>=C<sub>2</sub>H<sub>5</sub>CL
+POCL<sub>3</sub>+HCL
<br/>
4H<sub>3</sub>PO<sub>3</sub>=3H<sub>3</sub>PO<sub>4</sub>
+PH<sub>3</sub>
<br/>
PCL<sub>3</sub>+CL<sub>2</sub>=PCL<sub>5</sub>
</body>
</html>

BCA 1 Neha Giri PAGE | 29


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Q19. Write the HTML coding to display the following :


1. Actors
1. Bruce Willis
2. Gerard Butler
3. Vin Diesel
4. Bradd Pitt
2. Actress
1. Julia Roberts
2. Angelina Jolie
3. Kate Winslet
4. Cameron Diaz

SOURCE CODE:
<html>
<head><title> list format </title>
</head>
<body>
<ol type="1">
<li>Actors
<ol type="1">
<li>Bruce Willis</li>
<li>Gerard Butler</li>
<li>Vin Diesel</li>
<li>Bradd Pitt</li>
</ol>
</li>
<li>Actress
<ol type="1">

BCA 1 Neha Giri PAGE | 30


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<li>Julia Roberts</li>
<li>Angelina Jolie</li>
<li>Kate Winslet</li>
<li>Cameron Diaz</li>
</ol>
</li>
</ol>
</body>
<html>

OUTPUT:

BCA 1 Neha Giri PAGE | 31


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Q20. Write the HTML coding to display the following :


1. Cricket players
1. Batsman
1. Sachin Tendulkara
2. Rahul Dravid
3. Virendra sehwag
2. Bowler
1. Kumbale
2. Zaheer Khan
3. Balaji
3. Spinner
1. Harbhajan
2. Kumbale
3. Jadeja

SOURCE CODE:
<!DOCTYPE html>
<head>
<title> list format </title>
</head>
<body>
<ol type="1">
<li>Cricket players
<ol type="1">
<li>Batsman
<ol type="1">
<li>SachinTendulkara</li>
<li>Rahul Dravid </li>
<li>Virendrasehwag</li>
</ol>
</li>

BCA 1 Neha Giri PAGE | 32


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

<li>Bowler
<ol type="1">
<li>Kumbale</li>
<li>Zaheer Khan</li>
<li>Balaji</li>
</ol>
</li>
<li>Spinner
<ol type="1">
<li>Harbhajan</li>
<li>Kumbale</li>
<li>Jadeja</li>
</ol>
</li>
</ol>
</body>
</html>

OUTPUT:

BCA 1 Neha Giri PAGE | 33


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

CSS
1.Create a simple webpage using external CSS.

SOURCE CODE:
HTML FILE:
<html>
<head>
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>MAIC College </h1>
<h2>Maharaja Agrasen International College (MAIC) is affiliated to PanditRavishankar
Shukla University, Raipur,Chhattisgarh.
</h2>
<p> Located in the centre of the city in Samta Colony, it provides quality education.
Established by the Maharaja Agrasen Charitable Trust in 2006, the college has evolved into
one of the premier institutions of the Chhattisgarh with a National Assessment and
Accreditation Council (NAAC) B+ grade in the year 2017.
</p>
</body>
</html>

BCA 1 Neha Giri PAGE | 34


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

STYLE.CSS FILE
<style>
body {
background-color: beige;
}
h1 {
text-align: center;
background-color: chocolate;
}
p {
font-family: cursive;
}
</style>

OUTPUT:

BCA 1 Neha Giri PAGE | 35


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

2. Change the font size of the following paragraph to large by using the class
selector and emphasize the text “array”.
Array
An array is defined as the collection of similar type of data items stored at contiguous
memory location.
The array is the simplest data structure where each data element can be randomly accessed
by using its index number.
SOURCE CODE:
<html>
<head>
<title>Document</title>
<style>
.para {
font-size: large;
}
</style>
</head>
<body>
<h1>Array</h1>
<p class="para">An <em>array</em> is defined as the collection of similar type of data
items stored at contiguous memory location.</p>
<p class="para">The <em>array</em> is the simplest data structure where each data
element can be randomly accessed by using its index number.</p>
</body>
</html>

BCA 1 Neha Giri PAGE | 36


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

OUTPUT:

3. Write the code using an embedded style sheet to make the heading and image
center, If the image cannot be displayed set the alternate text “Image failed to
load”.
SOURCE CODE:
<html>
<head>
<title>Document</title>
<style>
h1 {
text-align: center;
}

BCA 1 Neha Giri PAGE | 37


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

img {
display: block;
width: 50%;
margin: auto;
}
</style>
</head>
<body>
<h1>This is image</h1>
<img src="tech.jpg" alt="image failed to load">
</body>
</html>
OUTPUT:

BCA 1 Neha Giri PAGE | 38


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

4. Write the HTML and CSS code and use the universal selector.
SOURCE CODE:
<html>
<head>
<title>Document</title>
<style>
*{
color: rgb(7 45 43);
background-color: bisque;
font-family: cursive;
}
</style>
</head>
<body><h1>MAIC College </h1>
<h2>MAIC is one of the premier institutions of Raipur the capital city of Chhattisgarh state.
</h2><p>MAIC is run by Shree Maharaja Agrasen Charitable Trust. The Trustees of MAIC
are the prestigious Dignitaries associated with the Economic and Social development of this
state.</p>
</body>
</html>

BCA 1 Neha Giri PAGE | 39


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

5. Create a webpage and add an image in the background so that the


image can cover the complete viewport.
SOURCE CODE:
<html>
<head><title>Document</title>
<style>
body {
background-image: url(kelly-sikkema-4JxV3Gs42Ks-unsplash.jpg);
background-size: cover;
}
h1 {
text-align: center;
background-color: #834731;
}
p {font-family: cursive;}
</style>
</head>
<body>
<h1>MAIC College </h1>
<h2>Maharaja Agrasen International College (MAIC) is affiliated to PanditRavishankar
Shukla University, Raipur,Chhattisgarh.</h2>
<p> Located in the centre of the city in Samta Colony, it provides quality education.
Established by the Maharaja Agrasen Charitable Trust in 2006, the college has evolved into
one of the premier institutions of the Chhattisgarh with a National Assessment and
Accreditation Council (NAAC) B+ grade in the year 2017.</p>
</body>
</html>

BCA 1 Neha Giri PAGE | 40


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

OUTPUT:

BCA 1 Neha Giri PAGE | 41


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

JAVASCRIPT
Q1. Create a script using for loop to print prime numbers between 1
and 50.
SOURCE CODE:
<html>
<head>
<title>JavaScript Prime</title>
</head>
<body>
<script>
for (var limit = 1; limit <= 50; limit++)
{
var a = false;
for (var i = 2; i <= limit; i++)
{
if (limit%i===0 && i!==limit)
{
a = true;
}
}
if (a === false)
{

BCA 1 Neha Giri PAGE | 42


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

document.write("<br>"+limit);
}
}
</script>
</body>
</html>

OUTPUT:

BCA 1 Neha Giri PAGE | 43


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Q2. Write a function to calculate the factorial of a number using on


click event.

SOURCE CODE:
<html>
<head>
<title>
JAVA
</title>
</head>
<body style="text-align:center;font-size: 24px;"> ENTER THE NUMBER ->
<input id="num">
<br><br>
<button onclick="FACT()">FACTORIAL</button>
<p id="answer"></p>
<script>
function FACT()
{
var i,num,ans;
ans=1;
num = document.getElementById("num").value;
for(i=1;i<=num;i++)
{
ans*=i;
}

BCA 1 Neha Giri PAGE | 44


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

document.getElementById("answer").innerHTML = +ans;
}
</script>
</body>
</html>

OUTPUT:

BCA 1 Neha Giri PAGE | 45


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Q3. Write a programto sum and multiply two numbers using


javascript.

SOURCE CODE:
<html>
<head>
<title> PRACTICAL 24 </title>
</head>
<body style="text-align:center;font-size: 24px;">
</body>
ENTER FIRST NUMBER :- <input id="num1"><br>
ENTER SECOND NUMBER :-<input id="num2">
<br><br>
<button onclick="answer()">CLICK</button>
<p id="ans1"></p>
<p id="ans2"></p>
<script>
function answer()
{
var num1,num2,ans1=0,ans2=1;
num1 =parseInt(document.getElementById("num1").value);
num2 = parseInt(document.getElementById("num2").value);
ans1 = num1 + num2;

BCA 1 Neha Giri PAGE | 46


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

ans2 = num1 * num2;

document.getElementById("ans1").innerHTML = "SUM IS :- "+ans1;


document.getElementById("ans2").innerHTML = "MULTIPLICATION IS :- "+ans2;
}
</script>
</body>
</html>

OUTPUT:

BCA 1 Neha Giri PAGE | 47


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Q4. Create a validation form in javascript

SOURCE CODE:
<html>
<body>
<script>
function validateform()
var name=document.getElementById("name");
var password=document.getElementById("password");
if (name.value==null || name.value=="")
{
alert("Name can't be blank");
return false;
}
else if(password.value.length<6)
{
alert("Password must be at least 6 characters long.");
return false;
}
</script>
<form method="get" onsubmit="return validateform()" action="register.html">
<table>
<tr>
<td>Enter Name: </td>
<td><input type="text" id="name"/></td>

BCA 1 Neha Giri PAGE | 48


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

</tr>
<tr>
<td>Password: </td>
<td><input type="password" id="password"/></td>
</tr>
</table>
<input type="submit" value="submit">
</form>
</body>
</html>

OUTPUT:

BCA 1 Neha Giri PAGE | 49


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

Q5. Write a program to show use of alert ,confirm and promote.

SOURCE CODE:
<html>
<body>
<div class="container"> This is a page
</div>
<script>
alert("Hello there");
let name =prompt("what is your name?","guest");
console.log(name);
let health= confirm("How are you today?");
if(health)
{
console.log("Great!!. May your tomorrow be great too");
}
else
{
console.log("Not Great!!.Well tomorrow will be the greatest");
}
</script>
</body>
</html>

BCA 1 Neha Giri PAGE | 50


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

OUTPUT:

BCA 1 Neha Giri PAGE | 51


WEB TECHNOLOGY AND E-COMMERCE 2022-2023

BCA 1 Neha Giri PAGE | 52

You might also like