CSS EPA Solution
CSS EPA Solution
Total 4 18 20
3.(d) 4 3.(d) 4
4.(d) 4
4.(a) 4 4.(c) 4
Regular Expression, Rollover and 5.(c) 6
5 4.(d) 4 4.(d) 4
Frames 6.(b) 6
5.(c) 6 6.(b) 6
Total 16 18 18
4.(b) 4 4.(b) 4 1.(f) 2
4.(c) 4 4.(e) 4 3.(b) 4
Menus,navigation and web page 4.(e) 4 6.(b) 6 4.(e) 4
6
protection 6.(c) 6 6.(c) 6 5.(c) 6
Total 18 20 16
4
4
2.(d) Write and explain a string functions for converting string to number and 4
number to string.
3.(a) Differentiate between concat( ) & join( ) methods of array object.
3.(b) Write a JavaScript function to check the first character of a string is uppercase
or not.
3.(c) Write a JavaScript function to merge two array & removes all duplicate
values.
Summer Unit 2 2.(b) Differentiate between concat() and join() methods of array object. 4
-2022 Array, 4.(b) Write a javascript function that accepts a string as a parameter and find the 4
Function and length of the string.
String 5.(b) Develop javascript to convert the given character to unicode and vice-versa. 6
6.(c) Write a javascript function to generate Fibonacci series till user defined limit.
Summer Unit 3 1.(f) Enlist any four mouse events with their use. 2
-2023 Form and 5.(a) Write HTML code to design a form that display two textboxes for accepting two numbers,one 6
Event textbox for accepting result and two buttons as ADDITION and SUBTRACTION.Write proper
Handling JavaScript such that when the user clicks on any one of the button,respective operation will be
performed on two numbers and result will be displayed in result textbox.
5.(b) Write HTML code to design a form that dsiplayes two buttons START and STOP.Write a 6
JavaScript code such that when user clicks on START button, real time digital clock will be
displayed on screen. When user clicks on STOP button,clock will stop displaying time(Use Timer
Methods) 6
6.(a) Explain how to evaluate Radiobutton in JavaScript with suitable example.
Winter- Unit 3 1.(f) Enlist & explain the use of any two Intrinsic JavaScript functions. 2
2022 Form and 6
Examination Paper Analysis
Event 5.(a) Write HTML script that will display following structure
Handling
6.(a) Write HTML script that will display dropdown list containing options such as
Red, Green, Blue & Yellow. Write a JavaScript program such that when the 6
user selects any options. It will change the background colour of webpage.
Summer Unit 3 1.(d) Explain following form events : 2
-2022 Form and (i) onmouseup
Event (ii) onblur
Handling 1.(e) Write a javascript program to changing the contents of a window. 2
2.(c) Write a javascript program to demonstrate java intrinsic function. 4
3.(c) Write a javascript program to calculate add, sub, multiplication and division
of two number (input from user). Form should contain two text boxes to input 4
numbers of four buttons for addition, subtraction, multiplication and division.
Summer Unit 4 Q3 d. Explain how to create and read Persistent Cookies in JavaScript with example. 4
-2023
Write the JavaScript code for below operations : (1) Name, Email & Pin Code should not be blank. (2) Pin
Code must contain 6 digits & it should not be accept any characters.
Q5 b. Write a webpage that displays a form that contains an input for username & password. User is
prompted to entre the input & password & password becomes the value of the cookie. Write a JavaScript
function for storing the cookie. It gets executed when the password changes.
Summer Unit 4 Q1 b. Differentiate between session cookies and persistent cookies. 2
-2022 Q1 e. Write a JavaScript program to changing the contents of a window. 2
Q1 g. Write a JavaScript syntax to accessing elements of another child window. 2
Q2 d. Design a webpage that displays a form that contains an input for user name and password. User is 4
prompted to enter the input user name and password and password become value of the cookies. Write the 4
JavaScript function for storing the cookies. 6
Q3 a. Write a JavaScript program to create read, update and delete cookies.
Q6 a. Write a JavaScript to open a new window and the new window is having two frames. One frame
containing button as “click here !”, and after clicking this button an image should open in the second frame of
that child window.
Summer Unit 5 Q4 d. Explain text and image rollover with suitable example. 2
-2023 Q5 c. Write HTML code to design a form that displays textboxes for accepting UserID and Aadhar No. and a 6
SUBMIT button. UserlD should contain 10 alphanumeric characters and must start with Capital Letter. Aadhar 6
No. should contain 12 digits in the format nnnn nnnn nnnn. Write JavaScript code to validate the UserID and
Aadhar No. when the user clicks on SUBMIT button.
Q6 b. Write a script for creating following frame structure : Frame 1 contains three buttons SPORT, MUSIC
and DANCE that will perform following action : When user clicks SPORT button, sport.html webpage will
appear in Frame 2. When user clicks MUSIC button, music.html webpage will appear in Frame 3. When user
clicks DANCE button, dance.html webpage will appear in Frame 4.
Examination Paper Analysis
Winter- Unit 5 Q3 d. Write a JavaScript function that will open new window when the user will clicks on the button. 4
2022 Q4 a. Describe text Rollover with the help of example. 4
Q4 c. Describe Quantifiers with the help of example. 4
Q4 d. Describe frameworks of JavaScript & its application. 4
Q5 c. Write a JavaScript for creating following frame structure : 6
Chapter 1 & Chapter 2 are linked to the webpage Ch1 HTML & Ch2.html respectively. When user click on
these links corresponding data appears in FRAME3.
Summer Unit 5 Q3 d. State what is regular expression. Explain its meaning with the help of a suitable example. 4
-2022 Q4 c. Write a JavaScript program to validate email ID of the user using regular expression. 4
Q4 d. Write a JavaScript program to design HTML page with books information in tabular format, use 4
rollovers to display the discount information. 6
Q6 b. Write a JavaScript to create option list containing list of images and then display images in new window
as per selection.
Summer Unit 6 Q4 b. List Ways of protecting your web page and describe any one of them. 4
-2023 Q4 c. Explain how to create and display Rotating Banner in JavaScript with example. 4
Q4 e. What is Status bar and how to display moving message on the status line of a window using 4
JavaScript. 6
Q6 c. Write a JavaScript to create a pull - down menu with four options [AICTE, DTE, MSBTE, GO0GLE].
Once the user will select one of the options then user will be redirected to that site.
Winter- Unit 6 Q4 b. Write a JavaScript program that will create pull-down menu with three options. Once the user will select 4
2022 the one of the options then user will redirected to that website. 4
Examination Paper Analysis
Q4 e. Describe how to link banner advertisement to URL with example. 6
Q6 b. Develop a JavaScript program to create Rotating Banner Ads. 6
Q6 c. Write a JavaScript for the folding tree menu.
Summer Unit 6 Q1 f. Explain frame works of JavaScript and its application. 2
-2022 Q3 b. Write a JavaScript program to link banner advertisements to different URLs. 4
Q4 e. List ways of protecting your webpage and describe any one of them. 6
Q5 c. Write a JavaScript program to create a slide show with the group of six images, also simulate the next 6
and previous transition between slides in your JavaScript.
Examination Paper Analysis
2.(a) Explain getter and setter properties in JavaScript with suitable example. 4M
Ans:
Getter
JavaScript object accessors are used to access and update the objects. Getter and setter are used as object explan
accessors to get or set object properties.
ation 2
Getter method helps in accessing the object methods as object properties.
Setter method is used to set object pro mark
perties. Setter
Using getter and setter the javascript provides better data security and data quality. explan
Example: ation 2
<!DOCTYPE html> marks
<html>
<body>
<script>
var car = {
brand: "Toyota",
color: "Blue",
get getBrand () {
return this.brand;
},
get getColor () {
return this.color;
},
set setBrand (newBrand) {
this.brand = newBrand;
},
set setColor (newColor) {
this.color = newColor;
}
};
document.write("Car Brand: " + car.brand + "<br>Car Color: " + car.color);
car.setBrand = "Tesla";
car.setColor = "Red";
document.write("<br><br>Car Brand: " + car.brand + "<br>Car Color: " + car.color);
</script>
</body>
</html>
Examination Paper Analysis
2.(b) Explain Object creation in JavaScript using ‘new’ keyword with adding properties and methods with 4M
example
Ans: Object
A javascript object is an entity having state and behavior. creatio
JavaScript is an object based language.
n2
There are three ways to create object:
1) By Object Literal mark
2) By creating instance of object directly
adding
propert
3) By using an object constructor
y and
metho
Example: d2
<script> mark
var emp =new Object();
emp.id=101;
emp.name=””Yash Desai”
emp.salary=50000;
document.write(emp.id+” “ +emp.name+” “emp.salary”);
</script>
Examination Paper Analysis
2.(c) Write a JavaScript for loop that will iterate from 1 to 15. For each iteration it will check if the 4M
current number is obb or even and display a message to the screen
Sample Output: Correc
“1 is odd” t logic
“2 is even”
progra
….............
….... m4
marks
Ans:
<script>
for(var i=1; i<=15; i++)
{
if(i%2)
{
document.write(i+”is even”);
}
else
{
document.write(i+”is odd”);
}
}
</script>
Examination Paper Analysis
Winter - Unit 1 1.(a) State the use of method in JavaScript with the help of suitable example. 2M
2022 Basics of Ans:
JavaScript Explan
Programmin A method/function is a set of statements that take inputs, do some specific computation, and produce output. ation 1
g The idea is to put some commonly or repeatedly done tasks together and make a function so that instead of
M and
writing the same code again and again for different inputs, we can call that function.
Example: exampl
function Addition (number1, number2) e1M
{
return number1 + number2;
}
Examination Paper Analysis
1.(b) List & explain datatypes in JavaScript 2M
Ans:
Listing
JavaScript provides different data types to hold different types of values. There are two types of data types in 1M
JavaScript, Primitive data type and Non-primitive data type
and
i) There are five types of primitive data types in JavaScript. They are as follows: explan
String - represents sequence of characters e.g., "hello" ation 1
Number - represents numeric values e.g., 100 M
Boolean - represents boolean value either false or true
Undefined - represents undefined value
Null - represents null i.e., no value at all
ii) The non-primitive data types are as follows:
Object - represents instance through which we can access members
Array - represents group of similar values
RegExp - represents regular expression
2.(a) Write a JavaScript program to validate user accounts for multiple set of user 4M
ID and password (using switch case statement).
Ans: Any
proper
<html>
correct
<body>
Enter your User ID logic
<input type="text" id="id"> progra
<br><br> m4M
Enter your Password
<input type="password" id="pass">
<br><br>
<input type="submit" onclick="check()">
Examination Paper Analysis
<br><br>
<p id="display"></p>
<script>
function check() {
var uid = document.getElementById('id').value;
var pass = document.getElementById('pass').value;
switch(uid){
case "[email protected]":
if(pass == "darshan@123"){
document.getElementById('display').innerHTML = "Valid User";
}
break;
case "[email protected]":
if(pass == "prashant@123"){
document.getElementById('display').innerHTML = "Valid User";
}
break;
case "[email protected]":
if(pass == "konisha@123"){
document.getElementById('display').innerHTML = "Valid User";
}
break;
default:
document.getElementById('display').innerHTML = "Invalid User";
}
}
</script>
</body>
</html>
4.(a) Differentiate between For-loop and For-in loop. 4M
Ans:
Any
For loop For-in loop four
for loop provides a concise way of writing the loop For-in loop in JavaScript is used to iterate over points
structure. the properties of an object.
of
For instance, if you want to iterate Certainly, for objects, the for-in loop allows you
over even numbers, you'd need to use the normal for to get the property name in the iteration
differen
loop variable. ce 1
point
Examination Paper Analysis
for (expr 1; expr 2; expr3) for (x in object) { one
{ code block to be executed mark
// code block to be executed }
}
// program to display text 5 times <script>
const n = 5; var code= {
CO : "Comp Engg.",
// looping from i = 1 to 5 IF : "Info Tech",
for (let i = 1; i <= n; i++) { EJ : "Electronics"
console.log(`I love JavaScript.`); }
} // using for...in
for ( var i in code) {
var c= code[i];
// display the values
document.write(i+"="+c+"<br>");
}
</script>
Ans: Correct
<script> logic
// program to check if the string is palindrome or not
progra
function checkPalindrome(string)
{ m6
// convert string to an array marks
const arrayValues = string.split('');
if(string == reverseString) {
document.write('It is a palindrome');
}
Examination Paper Analysis
else {
document.write('It is not a palindrome');
}
}
//take input
const string = prompt('Enter a string: ');
checkPalindrome(string);
</script>
Summer- Unit 2 1.(d) Write JavaScript that initializes an array called Colors with the names of 3 Colors and display array
2023 Array, elements. 2M
Function and Ans:
String <html lang="en"> Correct
logic
<body>
<script> progra
// Creating variables m2
var colors = ["Red", "Green", "Blue"]; Marks
</script>
</body>
</html>
Examination Paper Analysis
1.(e) Explain calling a function with arguments in JavaScript with example. 2M
Ans:
Each function definition contains a parameter list enclosed in the parenthesis. Explan
Syntax to declare the function along the parameter lists is: ation 1
Function function_name(parameter_list)
M
{
//Code to be excuted Exampl
} e1M
Example:
<script>
function maxTwo(x,y)
{
if(x,y)
return x;
else
return y;
}
</script>
2.(d) Write the use of charCodeAt() and fromCharCode() method with syntax and example 4M
Ans:
charChodeAt(): 2M for
The charCodeAt() method takes an integer as an argument that represents the index of the character charCo
in which you’re interested. If you don’t pass an argument, it defaults to index 0. deAt()
The charCodeAt() method returns the Unicode number of the string:
var UnicodeNum = StringName.charCodeAt() 2M for
fromCh
Example: arCode
<script>
()
var x="Javatpoint";
document.writeln(x.charCodeAt(3));
</script>
Examination Paper Analysis
fromCharCode():
If you need to know the character, number, or symbol that is assigned to a Unicode number, use the
fromCharCode() method. The fromCharCode() method requires one argument, which is the Unicode
number.
Example:
<html>
<body>
<script>
document.write("<br>"+res1);
</script>
</body>
</html>
3.(a) Differentiate between push() and join() method of array object with respect to use,syntax,return value and 4M
example.
Ans: Any 4
point
related
Push() Join()
to
This method adds zero or more elements to the end Returns the new string by concatenating all of the
of the array. elements in an array separated by a specified syntax,
character. return
Syntax: arr.push(element1, element2,----); Syntax: arr.join(separator); value
Separator is an optional parameter. By default it is and
comma exampl
Returns the new length of the array after appending Returns the string with all the array elements joined e
the new elements into the an array. by seperator
Example: Example”
<html> <html>
<head> <body>
<title> Array</title> <script>
<body>
<script> var products = new Array();
Examination Paper Analysis
var fruits = new Array(3); products[0] = 'Car ';
fruits[0] = "Banana"; products[1] = 'Water';
fruits[1] = "Orange"; products[2] = 'Soap';
fruits[2] = "Apple"; products[3] = 'Pizza';
fruits[3] = "Mango"; var str = products.concat();
for(i=0;i<fruits.length;i++) document.write(str);
{ document.write('<br>');
document.write(fruits[i] +" "+"<br>"); var str = products.join(' ');
} document.write(str);
fruits.push("Lemon"); </script>
for(i=0;i<fruits.length;i++) </body>
{ </html>
document.write(fruits[i] +" ");
}
</script>
</body>
</html>
Examination Paper Analysis
3.(b) Write a Javascript code to perform following operation on string (Use split() method) 4M
Input string : Sudha Narayana Murthy”
Display output as Any
First Name:Sudha correct
Middle Name: Narayana
logic
Last Name: Murthy
progra
Ans: m4
<script> Marks
Var str=” Sudha Narayana Murth”
Var arr=str.spilt(“ “,3);
document.write(“First Name:+arr[0]+”<br”>
document.write(“Middle Name:+arr[1]+”<br”>
document.write(“Last Name:+arr[1]+”<br”>
</script>
3.(c) Explain splice() method of array object with syntax and example. 4M
Ans:
Explan
The splice() method can be used to add new items to an array, and removes elements from an array. ation 2
Syntax: arr.splice(start_index,removed_elements,list_of_elemnts_to_be_added); marks
Parameter: Examp
•The first parameter defines the position where new elements should be added (spliced in). e2
•The second parameter defines how many elements should be removed. Marks
•The list_of_elemnts_to_be_added parameter define the new elements to be added(optional).
Output:
<html>
Examination Paper Analysis
<body>
<script>
var fruits = ["Banana", "Watermelon", "Chikoo", "Mango", "Orange", "Apple"]; document.write(fruits+"<br>");
fruits.splice(2,2, "Lemon", "Kiwi");
document.write(fruits+"<br>");
fruits.splice(0,2); //removes first 2 elements from array document.write(fruits+"<br>");
</script>
</body>
</html>
Output:
Banana,Watermelon,Chikoo,Mango,Orange,Apple Banana,Watermelon,Lemon,Kiwi,Orange,Apple
Lemon,Kiwi,Orange,Apple
Examination Paper Analysis
Winter - Unit 2 1.(d) Write a program using sort method of array object. 2M
2022 Array, Ans:
Function and Correct
String <html> Logic
<body>
progra
<script>
var array =[5,1,9,7,5]; m2
// sorting the array Marks
sorted = array.sort();
document.write(sorted);
</script>
</body>
</html>
Examination Paper Analysis
2.(a) Write a JavaScript program that will display current date in DD/MM/YYYY 4M
format.
Ans: Correct
logic
<!DOCTYPE html>
progra
<html lang="en">
<head> m4
<meta charset="UTF-8"> Marks
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var d=new Date();
var currentDate=d.getDate()+'/'+(d.getMonth()+1)+'/'+d.getFullYear()
document.write(currentDate)
</script>
</body>
</html>
Examination Paper Analysis
2.(b) Write a JavaScript program that will remove the duplicate element from an 4M
Array.
Ans: Correct
logic
<!DOCTYPE html>
progra
<html lang="en">
<body> m4
<script> Marks
let arr = ["scale", "happy", "strength", "peace", "happy", "happy"];
function removeDuplicates(arr) {
let unique = [];
for (i = 0; i < arr.length; i++) {
if (unique.indexOf(arr[i]) === -1) {
unique.push(arr[i]);
}
}
return unique;
}
document.write(removeDuplicates(arr));
</script>
</body>
</html>
2 (c) Write a JavaScript program that will display list of student in ascending order 4M
according to the marks & calculate the average performance of the class.
Correct
Progra
m4
Marks
Examination Paper Analysis
Ans:
<html>
<body>
<script>
var students = [["Amit", 70],["Sumit", 78],["Abhishek", 71],];
var Avgmarks = 0;
for (var i = 0; i < students.length; i++) {
Avgmarks += students[i][1];
for (var j = i + 1; j < students.length; j++) {
if (students[i] > students[j]) {
a = students[i];
students[i] = students[j];
students[j] = a
}
}
}
var avg = Avgmarks / students.length;
document.write("Average grade: " + Avgmarks / students.length);
document.write("<br><br>");
for (i = 0; i < students.length; ++i){
document.write(students[i]+"<br>")
}
</script>
</body>
</html>
Examination Paper Analysis
2.(d) Write and explain a string functions for converting string to number and
number to string.
Ans:
To covert string to number we can use parseInt() which converts a string number to a integer number.
Similarly we can use parseFloat(), number() for converting string to number.
Eg-
var a=prompt('Enter a number');
var b=parseInt(prompt('Enter a number'));
document.write(typeof a+"<br>");
document.write(typeof b);
To convert form number to string we can use toString()
<html>
<body>
<p>toString() returns a number as a string:</p>
<script>
let num = 12;
let text = num.toString();
document.write(num)
</script>
</body>
</html>
Examination Paper Analysis
3.(a) Differentiate between concat( ) & join( ) methods of array object. 4M
Ans:
Any 4
concat() of array object join() of array object points 4
The concat() method concatenates (joins) two or The join() method returns an array as a string. Marks
more arrays.
The concat() method does not change the existing The join() method does not change the original
arrays. array.
Syntax: array1.concat(array2, array3, ..., arrayX) Syntax: array.join(separator)
Any separator can be specified. The default is
comma (,).
Example: Example:
<script> <script>
var arr1 = ["Java", "Python"]; var fruits = ["Banana", "Orange", "Apple",
var arr2 = [1, 2, 3]; "Mango"];
var arr3 = arr1.concat(arr2); var text = fruits.join("#");
document.write(arr3); document.write(text);
</script> </script>
3.(b) Write a JavaScript function to check the first character of a string is uppercase 4M
or not.
Ans: Correct
Prgram
<html>
fro 4
<body>
<script> Marks
function upper_case(str)
{
regexp = /^[A-Z]/;
Examination Paper Analysis
if (regexp.test(str))
{
document.write("String's first character is uppercase");
}
else
{
document.write("String's first character is not uppercase");
}
}
upper_case('Abcd');
</script>
</body>
</html>
OR
<script>
function firstIsUppercase(str)
{
if (str.length === 0)
{
return false;
}
return str.charAt(0).toUpperCase() === str.charAt(0);
}
if (firstIsUppercase(prompt("Enter text")))
{
document.write('First letter is uppercase');
} else {
document.write('First letter is NOT uppercase');
}
</script>
3.(c) Write a JavaScript function to merge two array & removes all duplicate
values.
Ans:
<html>
<body>
<script>
function merge_array(array1, array2)
{
Examination Paper Analysis
var result_array = [];
var arr = array1.concat(array2);
var len = arr.length;
var assoc = {};
while(len--)
{
var item = arr[len];
if(!assoc[item])
{
result_array.unshift(item);
assoc[item] = true;
}
}
return result_array;
}
var array1 = [1, 2, 3,4,7,9];
var array2 = [2, 30, 1,40,9];
document.write(merge_array(array1, array2));
</script>
</body>
</html>
Output:
3,4,7,2,30,1,40,9
OR
<html>
<body>
<script>
function mergearr(arr1, arr2)
{
// merge two arrays
var arr = arr1.concat(arr2);
var uniqueArr = [];
// loop through array
for(var i of arr) {
if(uniqueArr.indexOf(i) === -1)
{
uniqueArr.push(i);
}
}
Examination Paper Analysis
document.write(uniqueArr);
}
var array1 = [1, 2, 3,6,8];
var array2 = [2, 3, 5,56,78,3]
mergearr(array1, array2);
</script>
</body>
</html>
Output:
1,2,3,6,8,5,56,78
Summer- Unit 2 2.(b) Differentiate between concat() and join() methods of array object.
2022 Array, Ans:
Function and concat() of array object join() of array object
String The concat() method concatenates (joins) two or The join() method returns an array as a string.
more arrays.
The concat() method does not change the existing The join() method does not change the original
arrays. array.
Syntax: array1.concat(array2, array3, ..., arrayX) Syntax: array.join(separator)
Any separator can be specified. The default is
comma (,).
Example: Example:
<script> <script>
var arr1 = ["Java", "Python"]; var fruits = ["Banana", "Orange", "Apple",
var arr2 = [1, 2, 3]; "Mango"];
var arr3 = arr1.concat(arr2); var text = fruits.join("#");
document.write(arr3); document.write(text);
</script> </script>
4.(b) Write a javascript function that accepts a string as a parameter and find the
length of the string.
Ans:
<html>
<body>
<p id="demo"></p>
<script>
function len(text)
{
Examination Paper Analysis
return (text.length);
}
document.getElementById("demo").innerHTML = "length of string="+len("Information");
</script>
</body>
</html>
Output:
5.(b) Develop javascript to convert the given character to unicode and vice-versa.
Ans:
<script>
var x="HeLLO";
document.writeln(x.charCodeAt(3));
document.writeln("<br>"+x.charCodeAt(1));
document.writeln("<br>"+x.charCodeAt(4));
document.writeln("<br>");
var res = String.fromCharCode(72, 69, 76, 76, 79);
document.write(res);
</script>
Output:
6.(c) Write a javascript function to generate Fibonacci series till user defined limit.
Ans:
<script>
function fibonacci(num)
Examination Paper Analysis
{
var x = 0;
var y = 1;
var z;
var i = 0;
document.write(x);
document.write("<br>"+y);
for (i = 2; i < num; i++)
{
z = x + y;
x = y;
y = z;
document.write("<br>"+y);
}
}
var num = parseInt(prompt('Enter the number of terms: '));
answer = fibonacci(num);
</script>
Summer- Unit 3 1.(f) Enlist any four mouse events with their use. 2
2023 Form and Ans: 6
Event Onclick:
Handling Fires on a mouse click on the element
Ondblclick: Fires on a mouse double-click on the element
Onmousedown: Fires when a mouse button is pressed down on an element
Onmousemove: Fires when the mouse pointer is moving while it is over an element 6
Onmouseout: Fires when the mouse pointer moves out of an element
Onmouseover:Fires when the mouse pointer moves over an element
Onmouseup: Fires when a mouse button is released over an element 6
Onwheel: Fires when the mouse wheel rolls up or down over an element
Oncontextmenu:oncontextmenu event occurs when the user right-clicks on an element to open the context
menu.
5.(a) Write HTML code to design a form that display two textboxes for accepting two numbers,one textbox for
accepting result and two buttons as ADDITION and SUBTRACTION.Write proper JavaScript such that when
the user clicks on any one of the button,respective operation will be performed on two numbers and result will
be displayed in result textbox.
Examination Paper Analysis
5.(b) Write HTML code to design a form that dsiplayes two buttons START and STOP.Write a JavaScript code
such that when user clicks on START button, real time digital clock will be displayed on screen. When user
clicks on STOP button,clock will stop displaying time(Use Timer Methods)
Ans:
<html>
<body>
<p>A script on this page starts this clock:</p>
<p id="demo"></p>
<button onclick="clearInterval(myVar)">Stop time</button>
<script>
var myVar = setInterval(myTimer ,1000);
function myTimer()
{
var d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
</script>
</body>
</html>
6.(a) Explain how to evaluate Radiobutton in JavaScript with suitable example.
Ans:
The radio button allows the user to choose one of a predefined set of options. You can define groups with the
name property of the radio buttons.
Radio buttons with the same name belong to the same group. Radio buttons with different names belongs to
the different groups. At most one radio button can be checked in a group.
Syntax:
<input type="radio" id="male" name="gender" value="male">
Code:
<html>
<body>
<form method="post" action=" " onsubmit="return ValidateForm();">
<fieldset>
<legend>Select Course:</legend>
Examination Paper Analysis
<input type="radio" name="br" value="IT" checked>IT<br>
<input type="radio" name="br" value="CO">CO<br>
<input type="radio" name="br" value="EJ">EJ<br>
<br>
<input type="submit" value="Submit now">
</fieldset>
</form>
<script type="text/javascript">
function ValidateForm()
{
var obj = document.getElementsByName("br");
for(var i = 0; i < obj.length; i++)
{
if(obj[i].checked == true)
{
if(confirm("You have selected " + obj[i].value))
return true;
else
return false;
}
}
}
</script>
</body>
</html>
Winter- Unit 3 1.(f) Enlist & explain the use of any two Intrinsic JavaScript functions. 2
2022 Form and Ans: 6
Event An intrinsic function (or built-in function) is a function (subroutine) available for use in a given programming
Handling language whose implementation is handled specially by the compiler. You can use intrinsic functions to make
reference to a data item whose value is derived automatically during execution.
abs() - The ABS function returns the absolute value of the argument.
sin() - The SIN function returns a numeric value that approximates the sine of the angle or arc specified by the
argument in radians.
sqrt() - The SQRT function returns a numeric value that approximates the square root of the argument
specified.
Date(): return current date.
Len(): returns number of characters in the text.
parseInt() - parseInt() function takes string as a parameter and converts it to integer.
parseFloat() - parseFloat() function takes a string as parameter and parses it to a floating point number.
Examination Paper Analysis
3.(c) Write a javascript program to calculate add, sub, multiplication and division
of two number (input from user). Form should contain two text boxes to input
numbers of four buttons for addition, subtraction, multiplication and division.
Ans:
<html>
<head>
<script>
function multiplyBy()
{
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num1 * num2;
}
function divideBy()
{
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num1 / num2;
Examination Paper Analysis
}
function add()
{
num1 = parseInt(document.getElementById("firstNumber").value);
num2 = parseInt(document.getElementById("secondNumber").value);
document.getElementById("result").innerHTML = num1 + num2;
}
function subtract()
{
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num1 - num2;
}
</script>
</head>
<body>
<form>
1st Number : <input type="text" id="firstNumber"><br>
2nd Number: <input type="text" id="secondNumber"><br><br>
<input type="button" onClick="multiplyBy()" Value="Multiply">
<input type="button" onClick="divideBy()" Value="Divide">
<input type="button" onClick="add()" Value="Addition">
<input type="button" onClick="subtract()" Value="Subtraction">
</form>
<p>The Result is : <br>
<p id = "result"></p>
</p>
</body>
</html>
Summer- Unit 4 Q3 d. Explain how to create and read Persistent Cookies in JavaScript with example. 4
2023 Ans:
A cookie is an amount of information that persists between a server-side and a
client-side.
A persistent cookie is a cookie that is assigned an expiration date.
Example:
<html>
Examination Paper Analysis
<head>
<script>
function writeCookie()
{
var d=new Date();
d.setTime(d.getTime()+(1000*60*60*24));
with(document.myform)
{
document.cookie="Name=" + person.value + ";expires=" +d.toGMTString();
}
}
function readCookie()
{
if(document.cookie=="")
document.write("cookies not found");
else
document.write(document.cookie);
}
</script>
</head>
<body>
<form name="myform" action="">
Enter your name:
<input type="text" name="person"><br>
<input type="Reset" value="Set C" type="button" onclick="writeCookie()">
<input type="Reset" value="Get C" type="button" onclick="readCookie()">
</form>
</body>
</html>
Winter- Unit 4 Q1 g. Describe browser location object. 2
2022 Ans: 6
i) The location object contains information about the current URL. 6
ii) The location object is a property of the window object.
iii) The location object is accessed with: window.location or just location.
Example:
<!DOCTYPE html>
<html>
<body>
Examination Paper Analysis
Write the JavaScript code for below operations : (1) Name, Email & Pin Code should not be blank. (2) Pin
Code must contain 6 digits & it should not be accept any characters.
Ans:
<html>
<head>
<style>
table,tr,td
{
border: solid black 1px;
border-collapse: collapse;
}
td
{
padding: 10px;
}
</style>
Examination Paper Analysis
</head>
<body>
<table>
<tbody>
<tr>
<td>Name : </td>
<td> <input type="text" id="name" required></td>
</tr>
<tr>
<td>Email : </td>
<td> <input type="email" id="email" required></td>
</tr>
<tr>
<td>Pin code : </td>
<td> <input type="number" id="pin" required></td>
</tr>
<tr>
<td></td>
<td><button onclick="submit()">Submit</button></td>
</tr>
</tbody>
</table>
</body>
<script>
function submit()
{
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var pin = Number(document.getElementById("pin").value);
if(name.length==0 || email.length==0 || pin.length==0)
{
alert("Please enter value in all fields.")
}
Examination Paper Analysis
else
{
var pinpattern =/^[4]{1}[0-9]{5}$/;
if( pinpattern.test(pin))
{
alert("Perfect Pin code");
}
else
{
alert("Wrong Pin code.");
}
}
}
</script>
</html>
Q5 b. Write a webpage that displays a form that contains an input for username & password. User is prompted
to entre the input & password & password becomes the value of the cookie. Write a JavaScript function for
storing the cookie. It gets executed when the password changes.
Ans:
<html>
<head>
<script>
function storeCookie()
{
var pwd = document.getElementById('pwd').value
document.cookie = "Password=" + pwd + ";"
alert("Cookie Stored\n"+document.cookie);
}
</script>
</head>
<body>
<form name="myForm">
Enter Username <input type="text" id="uname"/><br/>
Enter Password <input type="password" id="pwd"/><br/>
Examination Paper Analysis
Session cookie is automatically deleted when It is written to the computer’s hard disk and
the user exits the browser application. remains there until the expiration date has been
reached; then it’s deleted.
<html>
Q2 d. Design a webpage that displays a form that contains an input for user name and password. User is
prompted to enter the input user name and password and password become value of the cookies. Write
the JavaScript function for storing the cookies.
Ans:
<html>
<head>
<script>
function storeCookie()
{
var pwd = document.getElementById('pwd').value
document.cookie = "Password=" + pwd + ";"
alert("Cookie Stored\n"+document.cookie);
}
</script>
</head>
<body>
<form name="myForm">
Enter Username <input type="text" id="uname"/><br/>
Enter Password <input type="password" id="pwd"/><br/>
<input type="button" value="Submit" onclick="storeCookie()"/>
<p id="panel"></p>
Examination Paper Analysis
</form>
</body>
</html>
</form>
</body>
</html>
Q6 a. Write a JavaScript to open a new window and the new window is having two frames. One frame
containing button as “click here !”, and after clicking this button an image should open in the second
frame of that child window.
Ans:
Code:
f.html
<html>
<head>
<title>Create a Frame</title>
</head>
<frameset rows="60%,40%">
<frame src="b.html" name="a" />
<frame src="im.html" name="b" />
</frameset>
</frameset>
</html>
b.html
<html>
<head>
<title>Web Page 1</title>
</head>
<body>
<form action="" method="post">
<p><a href="j.png" target="b">
<input name="WebPage1" value="Click here!" type="button">
</a></p>
</body>
</html>
Examination Paper Analysis
im.html
<html>
<head>
<title>Web Page 1</title>
</head>
<body>
<img src="i.png">
</body>
</html>
Summer Unit 5 Q4 d. Explain text and image rollover with suitable example. 2
-2023 Ans: 6
6
Text rollover:
We can also create a rollover and rollback for text using the onmouseover and onmouseout.
Ans:
<html>
<head>
<title>
text rollovers</title>
</head>
<body>
<table border="1" width="100%">
<tbody>
<tr valign="top">
<td width="50%">
<a><img height="500" src="blue.png" width="900" name="clr"></a></td>
<td><a onmouseover="document.clr.src='blue.png' ">
<b><u> Blue Color</u></b></a> 55
<br>
Examination Paper Analysis
Image Rollover:
<html>
<head>
<title>JavaScript Image Rollovers</title>
</head>
<body>
<img src="blue.png" name="image1" onmouseover="src='car.jpg' " onmouseout="src='blue.png' ">
</img>
</body>
</html>
Q5 c. Write HTML code to design a form that displays textboxes for accepting UserID and Aadhar No.
and a SUBMIT button. UserlD should contain 10 alphanumeric characters and must start with Capital
Letter. Aadhar No. should contain 12 digits in the format nnnn nnnn nnnn. Write JavaScript code to
validate the UserID and Aadhar No. when the user clicks on SUBMIT button.
Ans:
<html>
<body>
<script>
function submitdata()
Examination Paper Analysis
{
Var userID=document.getElementById(‘uid’).value;
Var aadharno=document.getElementById(‘uaadhatNo’).value;
Var userIDExp=/^[A-Z][A-Z a-z 0-9] {9} $/;
Var aadharIDExp=/^\d{4} \d{4} \d{4} $/;
If(!userIDExp.test(userID))
{
Alert(“Invalid userID, it should contain 10 alphanumeric character);
}
Else if(!aadharNoExp.test(aadharNo);
{
Alert(“Invalid aadharNo, It should be in the nnnn nnnn nnnn format);
}
Else
{
Alert(“valid user”);
}
}
</script>
<form>
<inpt id=”aadhar no” type=”text” placeholder=”Enter your adhar no” required><br><br>
<button onclick=”Submitdata()”>
Submit</button>
</form>
</body>
</html>
Q6 b. Write a script for creating following frame structure : Frame 1 contains three buttons SPORT,
Examination Paper Analysis
MUSIC and DANCE that will perform following action : When user clicks SPORT button, sport.html
webpage will appear in Frame 2. When user clicks MUSIC button, music.html webpage will appear in
Frame 3. When user clicks DANCE button, dance.html webpage will appear in Frame 4.
Ans:
<html>
<head>
<title> main frame</title>
</head>
<frameset rows=”20%, 20%,60%”>
<frameset cols=”*,*,*”>
<frame src=”frame5.html>
<frame src=”frame1.html>
<frame src=”frame5.html>
</frameset>
<frame src=”finalf.html”>
<frameset cols=”*,*,*”>
<frame src=”frame2.html>
<frame src=”frame3.html>
<frame src=”frame4.html>
</frameset>
</frameset>
Examination Paper Analysis
</html>
Frame1.html
<html>
<body>
<center><b>frame1
</body>
</html>
Frame2.html
<html>
<head>
<body>
Welcome to Sport Page
</body>
</html>
Frame3.html
<html>
<head>
<body>
Welcome to Music Page
</body>
</html>
Frame4.html
<html>
Examination Paper Analysis
<head>
<body>
Welcome to Dance Page
</body>
</html>
Frame5.html
<html>
<head>
<body>
</body>
</html>
Frame6.html
<html>
<head>
<body>
<button onclick=”Frame2.html”>Sport</button>
</body>
</html>
Frame7.html
<html>
<head>
<body>
<button onclick=”Frame3.html”>Sport</button>
</body>
</html>
Examination Paper Analysis
Frame8.html
<html>
<head>
<body>
<button onclick=”Frame4.html”>Sport</button>
</body>
</html>
Winter- Unit 5 Q3 d. Write a JavaScript function that will open new window when the user will clicks on the button. 4
2022 Ans: 4
<html> 4
<body> 4
<button onclick="openWin()">Open "New Window"</button> 6
<script>
var myWindow;
function openWin()
{
myWindow = window.open("", "myWindow", "width=400,height=400");
myWindow.document.write("<p>Hello Everyone.Welcome to new window.</p>");
}
</script>
</body>
</html>
Q4 a. Describe text Rollover with the help of example.
Ans:
Rollover means a webpage changes when the user moves his or her mouse over an object on the page. It
is often used in advertising. There are two ways to create rollover, using plain HTML or using a mixture
of JavaScript and HTML. We will demonstrate the creation of rollovers using both methods.
The keyword that is used to create rollover is the <onmousover> event.
For example, we want to create a rollover text that appears in a text area. The text “What is rollover?”
appears when the user place his or her mouse over the text area and the rollover text changes to “Rollover
means a webpage changes when the user moves his or her mouse over an object on the page” when the
Examination Paper Analysis
user moves his or her mouse away from the text area.
The HTML script is shown in the following example:
Example:
<html>
<head></head>
<Body>
<textarea rows="2" cols="50" name="rollovertext" onmouseover="this.value='What is rollover?'"
onmouseout="this.value='Rollover means a webpage changes when the user moves his or her mouse over
an object on the page'"></textarea>
</body>
</html>
Q4 c. Describe Quantifiers with the help of example.
Ans:
The frequency or position of bracketed character sequences and single characters can be denoted by a
special character. Each special character has a specific connotation.
The +, *, ?, and $ flags all follow a character sequence.
Example:
<html>
<body>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction()
{
var str = "100, 1000 or 10000?";
var patt1 = /\d{3,4}/g;
var result = str.match(patt1);
document.getElementById("demo").innerHTML = result;
}
</script>
</body>
</html>
Applications:
Microsoft Office ,Gmail, Forbes, PayPal, Grasshopper, Samsung, Delta
3. Vue.js
Vue is an open-source JavaScript framework for creating a creative UI. The integration with Vue in
projects using other JavaScript libraries is simplified because it is designed to be adaptable.
Application:
VueJS is primarily used to build web interfaces and one-page applications. It can also be applied to both
desktop and mobile app development.
4. jQuery
It is a cross-platform JavaScript library designed to simplify HTML client-side scripting. You can use the
jQuery API to handle, animate, and manipulate an event in an HTML document, also known as DOM.
Also, jQuery is used with Angular and React App building tools.
Applications:
JQuery can be used to develop Ajax based applications. 2. It can be used to make code simple, concise
and reusable. 3. It simplifies the process of traversal of HTML DOM tree. 4. It can also handle events,
perform animation and add ajax support in web applications.
5. Node.js
Node.js is an open-source, server-side platform built on the Google Chrome JavaScript Engine. Node.js is
an asynchronous, single-threaded, non-blocking I/O model that makes it lightweight and efficient.
Applications:
Paypal, LinkedIn, Yahoo, Mozilla, Netflix, Uber, Groupon, GoDaddy, eBay
Q5 c. Write a JavaScript for creating following frame structure :
Chapter 1 & Chapter 2 are linked to the webpage Ch1 HTML & Ch2.html respectively. When user click
on these links corresponding data appears in FRAME3.
Ans:
Step 1) create file frame1.html
Examination Paper Analysis
<html>
<body>
<h1 align="center">FRAME1</h1>
</body>
</html>
Step 2) create frame2.html
<html>
<head>
<title>FRAME 2</title>
</head>
<body><H1>Operating System</H1>
<a href="Ch1.html" target="c"><UL>Chapter 1</UL></a>
<br>
<a href=" Ch2.html" target="c"><UL> Chapter 2</UL></a>
</body>
</html>
Step 3) create frame3.html
<html>
<body>
<h1>FRAME3</h1>
</body>
</html>
Step4) create frame_target.html
<html>
<head>
<title>Create a Frame</title>
</head>
<frameset rows="30%,*" border="1">
<frame src="frame1.html" name="a" />
<frameset cols="50%,*" border="1">
<frame src="frame2.html" name="b" />
<frame src="frame3.html" name="c" />
</frameset>
Examination Paper Analysis
</frameset>
</html>
Summer Unit 5 Q3 d. State what is regular expression. Explain its meaning with the help of a suitable example. 4
-2022 Ans: 4
A regular expression is an object that describes a pattern of characters. 4
The JavaScript RegExp class represents regular expressions, and both String and RegExp define methods 6
that use regular expressions to perform powerful pattern-matching and search-and-replace functions on
text.
A Regular Expression is a sequence of characters that constructs a search pattern. When you search for
data in a text, you can use this search pattern to describe what you are looking for.
Syntax:
A regular expression is defined with the RegExp () constructor as:
var pattern = new RegExp(pattern, attributes);
or simply
var pattern = /[pattern]/attributes;
Here,
Pattern – A string that specifies the pattern of the regular expression or another regular
expression.
Attributes – An optional string containing attributes that specify global, case-insensitive, and
multi-line matches.
Example:
<html>
<body>
<script>
//validating mobile number
function validatePhone(num) {
Q4 c. Write a JavaScript program to validate email ID of the user using regular expression.
Ans:
<html>
<head>
<title>JavaScript Regular expression to valid an email address</title>
</head>
<body>
<script>
function valid_email(str)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(mailformat.test(str))
{
alert("Valid email address!");
}
else
{
alert("You have entered an invalid email address!");
}
}
valid_email('[email protected]');
Examination Paper Analysis
</script>
</body>
</html>
Q4 d. Write a JavaScript program to design HTML page with books information in tabular format, use
rollovers to display the discount information.
Ans:
<html>
<head>
<title>
table rollovers</title>
<script>
function open_new_window(clrname)
{
if(clrname==1)
{
document.clr.src="c.jpg";
mwin=window.open('','myadwin','height=50,width=50,left=500,top=200');
mwin.document.write("Discount is 50%");
}
if(clrname==2)
{
document.clr.src="java.jpg";
mwin=window.open('','myadwin','height=50,width=50,left=500,top=200');
mwin.document.write("Discount is 40%");
}
if(clrname==3)
{
document.clr.src="p.jpg";
mwin=window.open('','myadwin','height=100,width=150,left=500,top=200');
mwin.document.write("Discount is 20%");
}
Examination Paper Analysis
}
</script>
</head>
<body>
<table border="1" width="100%">
<tbody>
<tr>
<td width="50%">
<a><img height="500" src="c.jpg" width="400" name="clr"></td>
<td><H2>
<a onmouseover="open_new_window(1)" onmouseout="mwin.close()">
<b><u>Programming in C</u></b></a>
<br><br>
<a onmouseover="open_new_window(2)" onmouseout="mwin.close()">
<b><u>Java</u></b></a>
<br><br>
<a onmouseover="open_new_window(3)" onmouseout="mwin.close()">
<b><u>Python</u></b></a>
</H2>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Q6 b. Write a JavaScript to create option list containing list of images and then display images in new
window as per selection.
Ans:
<html>
<body>
<label for="contries">Choose a Country:</label>
Examination Paper Analysis
<script>
changecontry= () => {
var contries = document.getElementById("contries").value;
switch(contries)
{
case "india":
var myWindow=window.open("i.png","MsgWindow", "width=200,height=100");
break;
case "japan":
var myWindow=window.open("j.png","MsgWindow", "width=200,height=100");
break;
case "usa":
var myWindow=window.open("u.png","MsgWindow", "width=200,height=100");
break;
default:
/*document.getElementById("city-name").innerHTML = "Nill";
document.getElementById("city-description").innerHTML = "Nill";
document.getElementById("city-image").src = "";*/
break;
}
}</script>
</body>
</html>
Summer Unit 6 Q4 b. List Ways of protecting your web page and describe any one of them. 4
-2023 Ans: 4
There is nothing secret about your web page. Anyone with a little computer knowledge can use a few 4
mouse clicks to display your HTML code, including your JavaScript, on the screen. 6
Examination Paper Analysis
<html>
<head>
<script>
window.onload = function()
{
document.addEventListener("contextmenu", function(e)
{
e.preventDefault();
}, false);}
</script>
<body>
<h3>Right click on screen,Context Menu is disabled</h3>
</body>
</html>
The preventDefault() method cancels the event if it is cancelable, meaning that the default action that
belongs to the event will not occur.
external file should have the .js file extension. The browser then calls the external file whenever the
browser encounters a JavaScript element in the web page. If you look at the source code for the web page,
you'll see reference to the external .js file, but you won't see the source code for the JavaScript.
webpage.html
<html>
<head>
<script src="mycode.js" languages="javascript" type="text/javascript">
</script>
<body>
<h3> Right Click on screen, Context Menu is disabled</h3>
</body>
</html>
mycode.js
window.onload=function()
{
document.addEventListener("contextmenu", function(e)
{
e.preventDefault();
}, false);
}
• The fourth string contains the subject line. As you'll recall from your HTML
training, you can generate the TO, CC, BCC, subject, and body of an e-mail from
within a web page.
You then use these four strings to build the e-mail address. This process starts by using the
replace() method of the string object to replace the & with the @ sign and the * with a period (.).
The underscores are replaced with nothing, which is the same as simply removing the underscores
from the string.
<html>
<head>
<title>Conceal Email Address</title>
<script>
function CreateEmailAddress()
{
var x = 'abcxyz*c_o_m'
var y = 'mai'
var z = 'lto'
var s = '?subject=Customer Inquiry'
x = x.replace('&','@')
x = x.replace('*','.')
x = x.replace('_','')
x = x.replace('_','')
var b = y + z +':'+ x + s
window.location=b;
}
</script>
</head>
<body>
<input type="button" value="send" onclick="CreateEmailAddress()">
</body>
</html>
Examination Paper Analysis
Q4 c. Explain how to create and display Rotating Banner in JavaScript with example.
Ans:
Following steps must be follow for creating banner in javascript:
Example:
<html >
<head>
<title>Banner Ads</title>
<script>
Banners = new Array('1.jpg','2.jpg','3.jpg');
CurrentBanner = 0;
function DisplayBanners()
{
if (document.images);
{
CurrentBanner++;
if (CurrentBanner == Banners.length)
{
CurrentBanner = 0;
}
document.RotateBanner.src= Banners[CurrentBanner];
setTimeout("DisplayBanners()",1000);
}
}
</script>
</head>
Examination Paper Analysis
Q4 e. What is Status bar and how to display moving message on the status line of a window using
JavaScript.
Ans:
To set the text in the status bar at the bottom of the browser window. The HTML standards now requires
setting window.status to have no effect on the text displayed in the status bar.
<script>
Var scrollpos=0
Var maxscroll=100;
Var blank=” “
Function scrollText(text,milliseconds)
{
Window.setInterval(“displayText(“+text+”);milliseconds)
}
Function displayText(text)
{
Window.defaultStatus=blanks+text++scrollpos
Blanks+=” “
If(scrollpos>maxscroll)
{
Scrollpos=0
Blanks=” “
}
</script>
Q6 c. Write a JavaScript to create a pull - down menu with four options [AICTE, DTE, MSBTE,
Examination Paper Analysis
GO0GLE]. Once the user will select one of the options then user will be redirected to that site.
Ans:
<html>
<head>
<title>HTML Form</title>
<script language="javascript" type="text/javascript">
function getPage(choice)
{
page=choice.options[choice.selectedIndex].value;
if(page != "")
{
window.location=page;
}
}
</script>
</head>
<body>
<form name="myform" action="" method="post">
Select Your Favourite Website:
<select name="MenuChoice" onchange="getPage(this)">
<option
value="https://www.google.com">Google</option>
<option
value="https://www.msbte.org.in">MSBTE</option>
<option
value="https://www.aicte-india.org/">AICTE</option>
<option
value="https://poly23.dtemaharashtra.gov.in/diploma23/">DTE</option>
</form>
</body>
</html>
Examination Paper Analysis
Winter- Unit 6 Q4 b. Write a JavaScript program that will create pull-down menu with three options. Once the user will 4
2022 select the one of the options then user will redirected to that website. 4
Ans: 6
<html> 6
<head>
<title>HTML Form</title>
<script language="javascript" type="text/javascript">
function getPage(choice)
{
page=choice.options[choice.selectedIndex].value;
if(page != "")
{
window.location=page;
}
}
</script>
</head>
<body>
<form name="myform" action="" method="post">
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>
Q4 e. Describe how to link banner advertisement to URL with example.
Ans:
The banner advertisement is the hallmark of every commercial web page. It is typically positioned near
the top of the web page, and its purpose is to get the visitor's attention by doing all sorts of clever things.
Examination Paper Analysis
To get additional information, the visitor is expected to click the banner so that a new web page opens.
You can link a banner advertisement to a web page by inserting a hyperlink into your web page that calls
a JavaScript function rather than the URL of a web page. The JavaScript then determines the URL that is
associated with the current banner and loads the web page that is associated with the URL.
Example:
<html>
<head>
<title>Link Banner Ads</title>
<script language="Javascript" type="text/javascript">
Banners = new Array('1.jpg','2.jpg','3.jpg')
BannerLink = new Array(
'google.com/','vpt.edu.in/', 'msbte.org.in/');
CurrentBanner = 0;
NumOfBanners = Banners.length;
function LinkBanner()
{
document.location.href =
"http://www." + BannerLink[CurrentBanner];
}
function DisplayBanners() {
if (document.images) {
CurrentBanner++
if (CurrentBanner == NumOfBanners) {
CurrentBanner = 0
}
document.RotateBanner.src= Banners[CurrentBanner]
setTimeout("DisplayBanners()",1000)
}
}
</script>
</head>
<body onload="DisplayBanners()" >
<center>
Examination Paper Analysis
</html>
Q6 c. Write a JavaScript for the folding tree menu.
Ans:
<html>
<head>
<style>
ul, #myUL {
list-style-type: none;
}
.caret::before {
content: "\25B6";
color: black;
display: inline-block;
margin-right: 6px;
}
.caret-down::before {
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Safari */'
transform: rotate(90deg);
}
.nested {
display: none;
}
.active {
display: block;
}
</style>
</head>
<body>
<h2>Folding Tree Menu</h2>
<p>A tree menu represents a hierarchical view of information, where each item can have a number of
subitems.</p>
<p>Click on the arrow(s) to open or close the tree branches.</p>
Examination Paper Analysis
<ul id="myUL">
<li><span class="caret">India</span>
<ul class="nested">
<li>Karnataka</li>
<li>Tamilnaadu</li>
<li><span class="caret">Maharashtra</span>
<ul class="nested">
<li>Mumbai</li>
<li>Pune</li>
<li><span class="caret">Navi Mumbai</span>
<ul class="nested">
<li>Nerul</li>
<li>Vashi</li>
<li>Panvel</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<script>
var toggler = document.getElementsByClassName("caret");
var i;
for (i = 0; i < toggler.length; i++) {
toggler[i].addEventListener("click", function() {
this.parentElement.querySelector(".nested").classList.toggle("active");
this.classList.toggle("caret-down");
});
}
</script>
</body>
</html>
Examination Paper Analysis
CurrentBanner = 0;
}
document.RotateBanner.src= Banners[CurrentBanner];
setTimeout("DisplayBanners()",1000);
}
}
</script>
</head>
<body onload="DisplayBanners();" >
<center>
<a href="javascript: LinkBanner()">
<img src="1.jpg"
width="400" height="200" name="RotateBanner" /></a>
</center>
</body>
</html>
Q4 e. List ways of protecting your webpage and describe any one of them.
Ans:
There is nothing secret about your web page. Anyone with a little computer knowledge can use a few
mouse clicks to display your HTML code, including your JavaScript, on the screen.
<html>
<head>
<script>
window.onload = function()
{
Examination Paper Analysis
document.addEventListener("contextmenu", function(e)
{
e.preventDefault();
}, false);}
</script>
<body>
<h3>Right click on screen,Context Menu is disabled</h3>
</body>
</html>
The preventDefault() method cancels the event if it is cancelable, meaning that the default action that
belongs to the event will not occur.
webpage.html
<html>
<head>
<script src="mycode.js" languages="javascript" type="text/javascript">
</script>
<body>
<h3> Right Click on screen, Context Menu is disabled</h3>
</body>
</html>
Examination Paper Analysis
mycode.js
window.onload=function()
{
document.addEventListener("contextmenu", function(e)
{
e.preventDefault();
}, false);
}
<html>
<head>
<title>Conceal Email Address</title>
<script>
Examination Paper Analysis
function CreateEmailAddress()
{
var x = 'abcxyz*c_o_m'
var y = 'mai'
var z = 'lto'
var s = '?subject=Customer Inquiry'
x = x.replace('&','@')
x = x.replace('*','.')
x = x.replace('_','')
x = x.replace('_','')
var b = y + z +':'+ x + s
window.location=b;
}
</script>
</head>
<body>
<input type="button" value="send" onclick="CreateEmailAddress()">
</body>
</html>
Q5 c. Write a JavaScript program to create a slide show with the group of six images, also simulate the
next and previous transition between slides in your JavaScript.
Ans:
<html>
<title>slideshow</title>
<body>
<h2 class="w3-center">Manual Slideshow</h2>
<div class="w3">
<img class="mySlides" src="1.jpg" style="width:50%">
Examination Paper Analysis
<script>
var slideIndex = 1;
showDivs(slideIndex);
function plusDivs(n)
{
showDivs(slideIndex += n);
}
function showDivs(n)
{
var i;
var x = document.getElementsByClassName("mySlides");
if (n > x.length)
{
slideIndex = 1
}
if (n < 1)
{
slideIndex = x.length
}
for (i = 0; i < x.length; i++)
Examination Paper Analysis
{
x[i].style.display = "none";
}
x[slideIndex-1].style.display = "block";
}
</script>
</body>
</html>