0% found this document useful (0 votes)
6 views

CssPrAns

The document contains a series of JavaScript code snippets demonstrating various programming tasks, including accepting user input, performing calculations, validating data, and manipulating arrays. Each task is presented with HTML structure and JavaScript code to achieve specific functionalities like displaying multiplication tables, calculating factorials, checking for prime numbers, and creating dynamic lists. The examples illustrate practical applications of JavaScript in web development.

Uploaded by

pizzabliss55
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
6 views

CssPrAns

The document contains a series of JavaScript code snippets demonstrating various programming tasks, including accepting user input, performing calculations, validating data, and manipulating arrays. Each task is presented with HTML structure and JavaScript code to achieve specific functionalities like displaying multiplication tables, calculating factorials, checking for prime numbers, and creating dynamic lists. The examples illustrate practical applications of JavaScript in web development.

Uploaded by

pizzabliss55
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 28

CSS practical list:

Write a JavaScript code to accept three names of flowers in an array and display them
using for loop.

Ans:
<html>

<body>

<script type="text/javascript">

var flowers=new Array();

var i;

flowers[0]=prompt("Enter name");

flowers[1]=prompt("Enter name");

flowers[2]=prompt("Enter name");

for(i=0; i<flowers.length;i++)

document.write(flowers[i] + "<br>");

</script>

</body>

</html>

Write a JavaScript code to display table of entered number using while loop.

Ans:
<html>

<body>

<script type="text/javascript">

var no=prompt("Enter number: ","0");

var i=1;

document.write("Multiplication table for " + no);

while(i<=10)
{

document.write("<br>" + no + "*" + i + "=" + no*i);

i++;

</script>

</body>

</html>

Write a JavaScript code to accept a number and display its factorial using loop.

Ans:
<!DOCTYPE html>

<html>

<head>

<title>Factorial Calculator</title>

</head>

<body>

<h2>Factorial Calculator</h2>

<input type="number" id="numberInput" placeholder="Enter a number">

<button onclick="calculateFactorial()">Calculate Factorial</button>

<script>

function calculateFactorial() {

var number = parseInt(document.getElementById("numberInput").value);

var factorial = 1;

if (number < 0) {

document.write("Please enter a non-negative number.");

return;

}
for (var i = 1; i <= number; i++) {

factorial *= i;

document.write("Factorial of " + number + " is: " + factorial);

</script>

</body>

</html>

Write a JavaScript code to accept a number and display whether it is prime or not.

Ans:
<!DOCTYPE html>

<html>

<head>

<title>Prime Number Checker</title>

</head>

<body>

<script>

var number = parseInt(prompt("Enter a number:"));

var isPrime = true;

if (number < 2) isPrime = false;

for (var i = 2; i < number; i++) {

if (number % i === 0) {

isPrime = false;

break;

}
}

if (isPrime) {

document.write(number + " is a prime number.");

} else {

document.write(number + " is not a prime number.");

</script>

</body>

</html>

Write a JavaScript code to accept three numbers and display a greatest number using
logical AND operator.

Ans:

<!DOCTYPE html>

<html>

<head>

<title>Greatest Number Checker</title>

</head>

<body>

<script>

var num1 = parseInt(prompt("Enter the first number:"));

var num2 = parseInt(prompt("Enter the second number:"));

var num3 = parseInt(prompt("Enter the third number:"));

var greatest;

if (num1 >= num2 && num1 >= num3) {

greatest = num1;

} else if (num2 >= num1 && num2 >= num3) {


greatest = num2;

} else {

greatest = num3;

document.write("The greatest number is: " + greatest);

</script>

</body>

</html>

Write a JavaScript code to declare an array with five names of flowers and display them
in sorted order.

Ans:
<html>

<head></head>

<body>

<script type="text/javascript">

var flowers=new Array("Rose", "Jasmine", "Mogra","Lotus","Jai");

var i;

document.write("Array Elements are : ");

for(i=0;i<flowers.length;i++)

document.write("<br>" + flowers[i]);

flowers.sort();

document.write("<br>Sorted Elements are : ");

for(i=0;i<flowers.length;i++)

document.write("<br>" + flowers[i]);
}

</script>

</body>

</html>

Write a JavaScript code to declare an array with five elements and display them in
reverse order of entry in an array.

Ans:
<html>

<head></head>

<body>

<script type="text/javascript">

var flowers=new Array ("Rose", "Jasmine", "Mogra","Lotus", "Jai");

var i;

document. write ("Array Elements are: ");

for (i=0; i<flowers. length; i++)

document. write("<br>" + flowers[i]);

flowers.reverse();

document. write("<br><br>Array Elements in

reverse order are: ");

for (i=0; i<flowers. length; i++)

document. write("<br>" + flowers[i]);

</script>

</body>
</html>

Write a JavaScript code to declare an array with three colors. Merge all array elements
in one string, separated with ‘&’ character and display the string. Write a JavaScript
code to copy one array into another array.

Ans:
<html>

<head></head>

<body>

<script type="text/javascript">

var arr=new Array("pink","blue","red");

var i;
document. write ("Array elements are: ");

for(i=0;i<arr.length;i++)

{
document. write("<br>" + arr[i]);

var str=arr.join('&');
document. write("<br>String = " + str);

</script>

</body>
</html>

Write a JavaScript code to copy one array into another array.

<html>

<body>

<script>

var originalArray=[1,2,3,4,5];
var copiedArray=originalArray.slice();
document.write("Original Array: " + originalArray.join(",")+"<br>");

document.write("Copied Array: " + copiedArray.join(","));


</script>

</body>
</html>

Write a JavaScript code to define a function that accepts one number as an argument
and display its cube.
Ans:
<html>
<body>
<script type="text/javascript">
function cube(no1)
{
var c=no1*no1*no1;
document.write("Cube of number " + no1 + "=" + c);
}
</script>
</body>
<script type="text/javascript">
var n=prompt("Enter number");
cube(n);
</script>
</html>

Write a JavaScript code to define a function input() that accept data of a student as rollno
,name and marks.
<html>
<body>
<script>
function input(){
var rollno,name,marks;
rollno=prompt("Enter roll number");
name=prompt("Enter name");
marks=prompt("Enter marks");
document.write("<br>Roll number: " + rollno);
document.write("<br>Name: " + name);
document.write("<br>Marks: " + marks);
calculate(marks);
}
function calculate(marks){
if(marks>50)
document.write("<br>Grade: Pass");
else
document.write("<br>Grade: Fail");
}
input();
</script>
</body>
</html>

Write a JavaScript code to define one more function as calculate that assigns result as
pass or fail. Call both the functions and display result with all data.
<html>
<body>
<script>
function input(){
var rollno,name,marks;
rollno=prompt("Enter roll number");
name=prompt("Enter name");
marks=prompt("Enter marks");
document.write("<br>Roll number: " + rollno);
document.write("<br>Name: " + name);
document.write("<br>Marks: " + marks);
calculate(marks);
}
function calculate(marks){
if(marks>50)
document.write("<br>Grade: Pass");
else
document.write("<br>Grade: Fail");
}
input();
</script>
</body>
</html>
Write a JavaScript code to define two functions as total() to calculates sum of five subjects
marks out of 500 and average() that displays average of marks. (Use function call from
another function).
Ans:
<html>
<body>
<h2>Marks Calculation</h2>
<button onclick="calculate()">Calculate</button>

<script>
function total() {
return 85 + 90 + 78 + 88 + 92;
}

function average() {
return total() / 5;
}

function calculate() {
alert("Total Marks: " + total() + " out of 500\nAverage Marks: " + average());
}
</script>
</body>
</html>

Write a JavaScript code to define a function compare() that accepts two numbers and
returns greater number after comparison. Display the greater number in <body> HTML
document.

Ans:
<html>

<body>

<h2>Compare Two Numbers</h2>

<button onclick="compare(10, 20)">Compare 10 and 20</button>

<script>

function compare(num1, num2) {

if (num1 > num2) {

document.write("The greater number is: " + num1);


} else {

document.write("The greater number is: " + num2);

</script>

</body>

</html>

Write a JavaScript code to accept email-id from user search ‘@’ symbol in the entered
string and display message as ‘valid email id’ if @ is present in entered string.

Ans:

<html>

<body>

<script type="text/javascript">

var str1=prompt("Enter string");

var index=str1.indexOf('@');

if(index!=-1)

document.write("Valid email id");

else

document.write("Not a valid email id");

</script>

</body>

</html>

Write a JavaScript code that will display count of occurrence of a character in a string.

Ans: <html>

<body>
<h2>Character Count</h2>

<button onclick="countCharacter()">Count Character</button>

<script>

function countCharacter() {

let str = "hello world";

let charToCount = "o";

let count = 0;

for (let i = 0; i < str.length; i++) {

if (str[i] === charToCount) {

count++;

alert("The character '" + charToCount + "' appears " + count + " times in the string.");

</script>

</body>

</html>

write JavaScript code to create and display persistent cookies with name and rollno.
<html>

<body>

<form name="userentry">

Enter Name<input type="text" name="cname">

Enter Roll Number<input type="text" name="rollno">

<input type="submit" value="Click" name="b1" onclick="writecookie()">

</form>

</body>

<script>

function writecookie() {

with(document.forms.userentry) {

var ck=cname.value;

var roll = rollno.value;

document.cookie="Custname=" + ck+";";

document.cookie = "Rollno=" + roll + ";";

var now=new Date();

now.setMonth(now.getMonth()+1);

document.cookie="expires="+now.toUTCString()+";";
document.write("Cookies are set! Customer Name: " + ck + ", Roll Number: " + roll);

</script>

</html>

Write JavaScript code to open new window and close opened window after clicking on
OPEN and CLOSE buttons.

<html>

<body>

<button onclick="openwindow()">open window</button>

<button onclick="closewindow()">close window</button>

<script>

var mywindow;

function openwindow()

mywindow=window.open("http://www.google.com","google","width=400,height=400,top=2
00,left=200");

function closewindow()

mywindow.close();

</script>

</body>
</html>

Write JavaScript code to search for presence of any character between J-P in string.
Returns True if series character is present in string.
<html>
<head>
<script>
function validate()
{
var name='Jayvant';
re = /[J-P]/;
if (re.test(name))
{
alert('Match Found');
}
else
{
alert('Match Not Found');
}
}
</script>
</head>
<body>
<form>
<p>
<input name="reg" value="test" type="button" onclick="validate ()">
</p>
</form>
</body>
</html>

Write a JavaScript program to validate mobile number using regular expression.

<html>

<head>

<script>

function validate()

{
with(document.forms.form1)

var name=form1.t1.value;

re = /\b[0-9]{10}\b/;

if (re.test(name))

alert('Correct contact number');

else

alert('Incorrect contact number');

</script>

</head>

<body>

<form name="form1">

<p>

Enter contact number: <input type="text" name="t1">

<input name="reg" value="Submit" type="button" onclick="validate()">

</p>

</form>

</body>

</html>

Write a JavaScript code to apply text rollover effect on a web page.


<html>

<head>

<title>rollover text</title>

</head>

<body>

<table width="100%" border="0">

<tr valign="top">

<td width="50">

<a>

<img height="200" src="s1.jpg" width="200" border="0" name="cover">

</a>

</td>

<td>

<a onmouseover="document.cover.src='s2.jpg'">

<b><u>java demystified</u></b> </a>

<br>

<a onmouseover= "document.cover.src='s3.jpg'">

<b><u>oop demystified</u></b> </a>

<br>

<a onmouseover= "document.cover.src='s4.jpg'">

<b><u>data structures demystified</u></b> </a>

</td>

</tr>

</table>

</body>

</html>
Write a JavaScript code to apply image rollover effect on a web page.

<html>

<body>

<table width="100%" border="0">

<tr valign="top">

<td width="50">

<a>

<img height="300" src="s1.jpg" width="300" border="0" onmouseover="src='s2.jpg'"


onmouseout="src='s1.jpg'">

</a>

</td>

<td>

<img height="1" src="" width="10">

</td>

<td>

<b><u>java demystified</u></b>

</font><font face="arial, helvetica, sans-serif" size="-1">

<br>jimkeogh / paperback / osborne mcgraw hill / 352pp.<br>isbn: 0072254548


may&nbsp;2004

</td>

</tr>

</table>

</body>

</html>

Write a JavaScript code to display entered number is prime or not.


<!DOCTYPE html>

<html>

<head>

<title>Prime Number Checker</title>

</head>

<body>

<script>

var number = parseInt(prompt("Enter a number:"));

var isPrime = true;

if (number < 2) isPrime = false;

for (var i = 2; i < number; i++) {

if (number % i === 0) {

isPrime = false;

break;

if (isPrime) {

document.write(number + " is a prime number.");

} else {

document.write(number + " is not a prime number.");

</script>

</body>

</html>
Write HTML code to design a form with one list box and submit button. Call JavaScript
function when webpage is loaded in the browser and add five elements in list box
dynamically.
Ans:
<!DOCTYPE html>
<html>
<head>
<title>Dynamic List Box</title>
<script>
function addOptions() {
var listBox = document.getElementById("myListBox");
var options = ["Option 1", "Option 2", "Option 3", "Option 4", "Option 5"];

// Using a traditional for loop


for (var i = 0; i < options.length; i++) {
var optionElement = new Option(options[i], options[i]);
listBox.add(optionElement);
}
}
window.onload = addOptions;
</script>
</head>
<body>

<form>
<label for="myListBox">Choose an option:</label>
<select id="myListBox" name="myListBox"></select><br><br>
<input type="submit" value="Submit">
</form>

</body>
</html>
Write JavaScript code to create a pull-down menu with three options as URL of three
different web pages. When any option is selected from menu, corresponding web page
should be loaded in web browser.
Ans:
<html>
<head>
<script>
function getPage(choice)
{
page=choice.options[choice.selectedIndex].value;
if(page != "")
{
window.location=page;
}
}
</script>
</head>
<body>
<form name="myform">
Select Your Favourite Website:
<select name="MenuChoice" onchange="getPage(this)">
<option value="select any option">Select</option>
<option value="https://www.codecademy.com/catalog/language/javascript/">CodeAcademy
</option>
<option value="https://www.msbte.org.in">MSBTE</option>
<option value="https://www.javatpoint.com/javascript-tutorial">JavaTpoint</option>
</form>
</body>
</html>

Write code to create following output on browser window. Frame 2 contains links. When
links are clicked corresponding page opens in frame3.

Frame 1: Welcome to JavaScript

Frame 2:
Cookies Frame 3
Rollover
StatusBar
Ans:
first.html:
<html>
<body>
<h1><b>Frame 1:</b></h1>
Welcome to JavaScript<br>
</body>
</html>

second.html:
<html>
<body>
<h1><b>Frame 2:</b><br>
<ul>
<li><a href="cookies.html" target="mainframe">Cookies</a></li>
<li><a href="Rollover.html" target="mainframe">Rollover</a></li>
<li><a href="statusbar.html" target="mainframe">Statusbar</a></li>
</ul>
</body>
</html>

third.html:
<html>
<body>
<h1><b>Frame 3:</b></h1>
<br>
</body>
</html>

cookies.html:
<html>
<body>
Hello Bhava...!
</body>
</html>

main.html:
<html>
<head>
<title>Create a Frame</title>
</head>
<frameset rows="30%,*" border="5">
<frame src="first.html" name="a" />
<frameset cols="30%,*" border="5">
<frame src="second.html" name="b" />
<frame src="third.html" name="mainframe" />
</frameset>
</frameset>
</html>

write a program to create dynamic menu with semester menu and subject’s
menu
Ans:
<html>
<head>
<title>Dynamically Changing Menu Options</title>
<script type="text/javascript">
fifthsem = new Array('CSS','AJP','OSY'); // Array elements for
subject menu if sem fifth is selected
sixthsem = new Array('PHP','MAD', 'ETI'); // Array elements for
subject menu if sem sixth is selected
function Getsubjects(Semester)
{
for(i=document.Form1.subjects.options.length-1;i>0; i--)
{
document.Form1.subjects.options.remove(i) //Clear existing
options from subjects
}
semvalue = Semester.options[Semester.selectedIndex].value; //
finding selected semester from sem menu
if (semvalue != "")
{
if (semvalue == '1')
{
for (i=1; i<=fifthsem.length;i++)
{
document.Form1.subjects.options[i] =new Option(fifthsem[i-1]);
// loading options from array into subjects menu for fifth sem
}
}
if (semvalue == '2')
{
for (i=1; i<=sixthsem.length;i++)
{
document.Form1.subjects.options[i] =new Option(sixthsem[i-1]);
// loading options from array into subjects menu for sixth sem
}
}
}
}
</script>
</head>
<body onload="document.Form1.Semester.selectedIndex=0">
<form name="Form1">
<select name="Semester" onchange="Getsubjects(this)"> // First
menu as semester
<option value="0">Semester</option>
<option value="1">Fifth</option>
<option value="2">Sixth</option>
</select>
<select name="subjects">
// Second menu as subjects
<option value="0">Subjects</option>
</select>
<br>
<p>
<input type="submit" value="Submit" />
<input type="reset" />
</p>
</form>
</body>
</html>
Write JavaScript code to create a banner with five images.
Ans:
<html>
<head>
<title>Banner Ads</title>
<script type="text/javascript">
Banners = new Array('s1.jpg','s2.png','s3.png','s4.png',’s5.png’);
CurrentBanner = 0; //index variable
function DisplayBanners()
{
if (document.images)
// Declare image array
{
CurrentBanner++;
if (CurrentBanner == Banners.length)
{
CurrentBanner = 0
}
document.RotateBanner.src= Banners[CurrentBanner]
setTimeout("DisplayBanners()",5000)
}
}
</script>
</head>
<body onload="DisplayBanners()">
<center>
// set timer
// call to function
<img src="s1.jpg" width="400" height="275" name="RotateBanner" >
</center>
</body>
</html>
Write a JavaScript code to create a slideshow with five images
Ans:
<html>
<head>
<title>Slideshow</title>
<script type="text/javascript">
var Pictures = new Array("image1.jpg", "image2.jpg", "image3.jpg",
"image4.jpg", "image5.jpg");
var CurrentPicture = 0;

function RunSlideShow(i) {
if (document.images) {
if (CurrentPicture >= Pictures.length) {
CurrentPicture = 0;
}
if (CurrentPicture < 0) {
CurrentPicture = Pictures.length - 1;
}
document.PictureDisplay.src = Pictures[CurrentPicture];
CurrentPicture = CurrentPicture + i;
}
}
</script>
</head>

<body>
<p align="center">
<img src="image1.jpg" name="PictureDisplay" width="400" height="275" />
</p>

<center>
<table border="0">
<tr>
<td align="center">
<input type="button" value="Forward" onclick="RunSlideShow(1)">
<input type="button" value="Back" onclick="RunSlideShow(-1)">
</td>
</tr>
</table>
</center>
</body>
</html>
write a JavaScript code to change the message in status bar with text
rollover.
<html>
<head>
<script type="text/javascript">
window.status="You are in home page";
function displaystatus(no)
{
if(no==1)
{
window.status="You are in CSS";
}
if(no==2)
{
window.status="You are in AJP";
}
if(no==3)
{
window.status="You are in OSY";
}
}
</script>
</head>
<body>
Hi welcome
<a onmouseover="displaystatus(1)">CSS</a>
<a onmouseover="displaystatus(2)">AJP</a>
<a onmouseover="displaystatus(3)">OSY</a>
</body>
</html>

You might also like