0% found this document useful (0 votes)

7 views

CSS Final Theory All Papers

The document outlines the examination instructions and model answers for the Winter 2022 examination on Client-Side Scripting by the Maharashtra State Board of Technical Education. It includes guidelines for examiners on assessing student responses, as well as a variety of programming questions and their model answers related to JavaScript. Key topics covered include methods, data types, intrinsic functions, and array operations in JavaScript.

Uploaded by

2006bhargavraut

Available Formats

Download as PDF, TXT or read online on Scribd

0% found this document useful (0 votes)

7 views

CSS Final Theory All Papers

Uploaded by

2006bhargavraut

Available Formats

Download as PDF, TXT or read online on Scribd

You are on page 1/ 289

MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION

(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
WINTER – 2022 EXAMINATION
Subject Name: Client-Side Scripting Model Ans Subject Code: 22519
Important Instructions to examiners: XXXXX
1) The answers should be examined by key words and not as word-to-word as given in the model answer
scheme.
2) The model answer and the answer written by candidate may vary but the examiner may try to assess the
understanding level of the candidate.
3) The language errors such as grammatical, spelling errors should not be given more Importance (Not
applicable for subject English and Communication Skills.
4) While assessing figures, examiner may give credit for principal components indicated in the figure. The
figures drawn by candidate and model answer may vary. The examiner may give credit for any equivalent
figure drawn.
5) Credits may be given step wise for numerical problems. In some cases, the assumed constant values may
vary and there may be some difference in the candidate’s answers and model answer.
6) In case of some questions credit may be given by judgement on part of examiner of relevant answer based
on candidate’s understanding.
7) For programming language papers, credit may be given to any other program based on equivalent concept.
8) As per the policy decision of Maharashtra State Government, teaching in English/Marathi and Bilingual
(English + Marathi) medium is introduced at first year of AICTE diploma Programme from academic year
2021-2022. Hence if the students in first year (first and second semesters) write answers in Marathi or
bilingual language (English +Marathi), the Examiner shall consider the same and assess the answer based
on matching of concepts with model answer.

Q. Sub Answer Marking

No. Q. Scheme
N.

1 Attempt any FIVE of the following: 10 M

a) State the use of method in javascript with the help of suitable example. 2M

Ans A method/function is a set of statements that take inputs, do some specific computation, Explanation
and produce output. The idea is to put some commonly or repeatedly done tasks together - 1 M and
and make a function so that instead of writing the same code again and again for different Example-
1 M.
inputs, we can call that function.

Example:
function Addition (number1, number2)
{
return number1 + number2;
}
b) List & Explain datatypes in JavaScript. 2M

Ans JavaScript provides different data types to hold different types of values. There are two Any four,
types of data types in JavaScript, Primitive data type and Non-primitive data type ½ for each
i) There are five types of primitive data types in JavaScript. They are as follows:
String - represents sequence of characters e.g., "hello"
Number - represents numeric values e.g., 100
Page No: 1 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
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
c) Write a simple calculator program using switch case in JavaScript. 2M

Ans <html> 2 M for

<body> relevant
<script> program.
const number1 = parseFloat(prompt("Enter first number: "));
const number2 = parseFloat(prompt("Enter second number: "));

const operator = prompt("Enter operator ( either +, -, *, / or %): ");

let result;

switch (operator) {
case "+":
result = number1 + number2;
document.write(result);
break;
case "-":
result = number1 - number2;
document.write(result);
break;

case "*":
result = number1 * number2;
document.write(result);
break;

case "/":
result = number1 / number2;
document.write(result);
break;

case "%":
result = number1 % number2;
document.write(result);
break;

Page No: 2 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________

default:
document.write("Invalid operator");
break;
}
</script>
</body>
</html>
d) Write a program using sort method of array object. 2M

Ans <html> 2 M for

<body> relevant
<script> program.
var array =[5,1,9,7,5];
// sorting the array
sorted = array.sort();
document.write(sorted);
</script>
</body>
</html>
e) Describe property Getters & Setters. 2M

Ans JavaScript object accessors are used to access and update the objects. Getter and setter are 1 m for each
used as object accessors to get or set object properties.

Getter method helps in accessing the object methods as object properties.

Setter method is used to set object properties.

Using getter and setter the javascript provides better data security and data quality.

Example:

<!DOCTYPE html>
<html>
<body>
<script>
var car = {
brand: "Toyota",
color: "Blue",

get getBrand () {
return this.brand;
},
get getColor () {
return this.color;

Page No: 3 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
},

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>
f) Enlist & explain the use of any two Intrinsic JavaScript Functions. 2M

Ans An intrinsic function (or built-in function) is a function (subroutine) available for use in a 1 M for
given programming language whose implementation is handled specially by the compiler. each
You can use intrinsic functions to make reference to a data item whose value is derived function
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.

g) Describe browser location object. 2M

Page No: 4 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
Ans i) The location object contains information about the current URL. Explanation
ii) The location object is a property of the window object. 1M
iii) The location object is accessed with: window.location or just location. Example-
Example: 1M
<!DOCTYPE html>
<html>
<body>
<h1>The Window Location Object</h1>
<p id="demo"></p>
<script>
let origin = window.location.origin;
document.getElementById("demo").innerHTML = origin;
</script>
</body>
</html>

2. Attempt any THREE of the following: 12 M

a) Write a JavaScript program that will display current date in DD/MM/YYYY format. 4M

Ans <!DOCTYPE html> Any

relevant
<html lang="en"> code 4 M.

<head>

<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>

var d=new Date();

var currentDate=d.getDate()+'/'+(d.getMonth()+1)+'/'+d.getFullYear()

document.write(currentDate)

Page No: 5 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
</script>

</body>

</html>

b) Write a JavaScript program that will remove the duplicate element from an array. 4M

Ans <!DOCTYPE html> Any

<html lang="en"> relevant
<body> code 4 M.
<script>
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>
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.

Student Name Marks

Amit 70
Sumit 78
Abhishek 71

Ans <html> Any

relevant
<body> code 4 M.

var students = [["Amit", 70],["Sumit", 78],["Abhishek", 71],];

var Avgmarks = 0;

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

Page No: 6 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
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>

d) Write and explain a string functions for converting string to number and number to 4M
string.

Ans To covert string to number we can use parseInt() which converts a string number to a Any
integer number. Similarly we can use parseFloat(), number() for converting string to relevant
number. code with
explanation
Eg- 4 M.
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>
Page No: 7 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
<body>
<p>toString() returns a number as a string:</p>
<script>
let num = 12;
let text = num.toString();
document.write(num)
</script>
</body>
</html>

3. Attempt any THREE of the following: 12 M

a) Differentiate between concat( ) & join( ) methods of array object. 4M

Ans Any 4
concat() join() point=4M
The concat() method concatenates (joins) two The join() method returns an array as
or more arrays. a string.
The concat() method returns a new array,
containing the joined arrays.
The concat() method separates each value with Any separator can be specified. The
a comma only. default is comma (,).
Syntax: Syntax:
array1.concat(array2, array3, ..., arrayX) array.join(separator)
Example: Example:
<script> <script>
const arr1 = ["CO", "IF"]; var fruits = ["Banana", "Orange",
const arr2 = ["CM", "AI",4]; "Apple", "Mango"];
const arr = arr1.concat(arr1, arr2); var text = fruits.join();
document.write(arr); document.write(text);
</script> var text1 = fruits.join("$$");
document.write("<br>"+text1);
</script>

b) Write a JavaScript function to check the first character of a string is uppercase or 4M

not.

Ans <html> Correct

<body> function
<script> logic=4M
function upper_case(str)
{
regexp = /^[A-Z]/; (any other
if (regexp.test(str)) relevant
{
document.write("String's first character is uppercase");
Page No: 8 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
} logic can
else consider)
{
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>

c) Write a JavaScript function to merge two array & removes all duplicate 4M
values.
Ans <html> Correct
<body> function
<script> logic=4 M
function merge_array(array1, array2)
{
var result_array = []; (any other
relevant
var arr = array1.concat(array2);
logic can
var len = arr.length; consider)
var assoc = {};

Page No: 9 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
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

<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);
}
}
document.write(uniqueArr);
}
Page No: 10 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
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

d) Write a JavaScript function that will open new window when the user will 4M
clicks on the button.
Ans <html> Correct
<body> function
<button onclick="openWin()">Open "New Window"</button> logic=4 M
<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>

4. Attempt any THREE of the following: 12 M

a) Describe text Rollover with the help of example. 4M

Ans Rollover means a webpage changes when the user moves his or her mouse over an object Define
on the page. It is often used in advertising. There are two ways to create rollover, using Rollover-2
plain HTML or using a mixture of JavaScript and HTML. We will demonstrate the creation M
of rollovers using both methods.

The keyword that is used to create rollover is the <onmousover> event.

Example-2
For example, we want to create a rollover text that appears in a text area. The text “What M
is rollover?” appears when the user place his or her mouse over the text area and the
(For
rollover text changes to “Rollover means a webpage changes when the user moves his or
example,
her mouse over an object on the page” when the user moves his or her mouse away from
any other
the text area.
relevant

Page No: 11 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
The HTML script is shown in the following example: logic can be
considered)
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>

b) Write a JavaScript program that will create pull-down menu with three 4M
options. Once the user will select the one of the options then user will redirected
to that website.

Ans <html> Creation of

<head> pull-down
<title>HTML Form</title> menus-1 M
<script language="javascript" type="text/javascript">
function getPage(choice)
{ Correct
page=choice.options[choice.selectedIndex].value; function to
if(page != "") redirect
{ particular
window.location=page; website-3 M
}
}
</script>
OR
</head>
<body>
<form name="myform" action="" method="post">
Select Your Favourite Website: any other
<select name="MenuChoice" onchange="getPage(this)"> relevant
<option value="select any option">Select</option> logic can be
<option value="https://www.codecademy.com/catalog/language/javascript/"> considered
CodeAcademy </option>
<option value="https://www.msbte.org.in">MSBTE</option>
<option value="https://www.javatpoint.com/javascript-tutorial">JavaTpoint</option>
</form>
</body>
</html>

Page No: 12 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________

Output:

c) Describe Quantifiers with the help of example. 4M

Ans The frequency or position of bracketed character sequences and single characters can be Describe
denoted by a special character. Each special character has a specific connotation. Quantifiers-
The +, *, ?, and $ flags all follow a character sequence. 2M
For
Sr.No. Expression & Description
Example-2
p+ M
1
It matches any string containing one or more p's.
p*
2
It matches any string containing zero or more p's.
p?
3
It matches any string containing at most one p.(zero or one occurrences)
p{N}
4
It matches any string containing a sequence of N p's
p{2,3}
5
It matches any string containing a sequence of two or three p's.
p{2, }
6
It matches any string containing a sequence of at least two p's.
p$
7
It matches any string with p at the end of it.
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;

Page No: 13 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
var result = str.match(patt1);
document.getElementById("demo").innerHTML = result;
}
</script>
</body>
</html>
d) Describe frameworks of JavaScript & its application. 4M

Ans Frameworks of JavaScript: Any 2

1. ReactJs
React is based on a reusable component. Simply put, these are code blocks that can be (1m for
classified as either classes or functions. Each component represents a specific part of a explanation
page, such as a logo, a button, or an input box. The parameters they use are called props, and 1M for
which stands for properties. application)

Applications:
React is a JavaScript library developed by Facebook which, among other things, was used
to build Instagram.com.

2. Angular
Google operates this framework and is designed to use it to develop a Single Page
Application (SPA). This development framework is known primarily because it gives
developers the best conditions to combine JavaScript with HTML and CSS. Google
operates this framework and is designed to use it to develop a Single Page Application
(SPA). This development framework is known primarily because it gives developers the
best conditions to combine JavaScript with HTML and CSS.

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:
1. 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.
Page No: 14 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________

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

e) Describe how to link banner advertisement to URL with example. 4M

Ans The banner advertisement is the hallmark of every commercial web page. It is typically Banner-1 M
positioned near the top of the web page, and its purpose is to get the visitor's attention by Example-3
doing all sorts of clever things. M
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>
<a href="javascript: LinkBanner()"><img src="1.jpg"
Page No: 15 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
width="400" height="75" name="RotateBanner" /></a>
</center>
</body> </html>

5. Attempt any TWO of the following: 12 M

a) Write HTML script that will display following structure 6M

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> Creation of
<head> correct form
<style> and calling
table,tr,td event-2 M
{
border: solid black 1px;
border-collapse: collapse;
Name,
}
Email and
Pin code
td
should not
{
be blank-2
padding: 10px;
M
}
</style>
</head>
<body>
<table>
<tbody> Pin code
<tr> must
<td>Name : </td> contain 6
<td> <input type="text" id="name" required></td> digits and it
</tr> should not
<tr> be blank-2
<td>Email : </td> M
<td> <input type="email" id="email" required></td>
</tr>
<tr>

Page No: 16 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
<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.")
}
else
{
var pinpattern =/^[4]{1}[0-9]{5}$/;
if( pinpattern.test(pin))
{
alert("Perfect Pin code");
}
else
{
alert("Wrong Pin code.");
}
}
}
</script>
</html>

b) Write a webpage that displays a form that contains an input for user name and 6M
password. User is prompted to enter the input user name and password and password
becomes the value of the cookie. Write the JavaScript function for storing the cookies.
It gets executed when the password changes.
Ans <html> Creation of
<head> form=2 M
<script> Storing and
function storeCookie() display
{ cookie
var pwd = document.getElementById('pwd').value information-
document.cookie = "Password=" + pwd + ";" 4M

Page No: 17 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
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>
</form>
</body>
</html>

c) Write a JavaScript for creating following frame structure: 6M

Chapter 1 and Chapter 2 are linked to the webpage Ch1.html and ch2.html
respectively. When user click on these links corresponding data appears in
FRAME3.
Ans Step 1) create file frame1.html Correct
<html> frameset
<body> logic=6 M
<h1 align="center">FRAME1</h1>
</body>
</html> OR
( any other
relevant
Step 2) create frame2.html
logic can be
<html> considered )
<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>

Page No: 18 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
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>
</frameset>
</html>

Output:

6. Attempt any TWO of the following: 12 M

a) Write HTML script that will display dropdown list containing options such as 6M
Red, Green, Blue and Yellow. Write a JavaScript program such that when the
user selects any options. It will change the background colour of webpage.

Page No: 19 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
Ans <html> Creation of
<body> list-2 M
<label for="color">Choose a Background Color:</label>
<select name="color" id="color" class="color" onchange="changeColor()"> Correct
<option value="red">Red</option> logic to
<option value="green">Green</option> Change
<option value="blue">Blue</option> background
<option value="yellow">Yellow</option> color as per
</select> selection-4
<script type="text/javascript"> M
function changeColor() {
var color = document.getElementById("color").value;
switch(color){
case "green":
document.body.style.backgroundColor = "green";
break;
case "red":
document.body.style.backgroundColor = "red";
break;
case "blue":
document.body.style.backgroundColor = "blue";
break;
case "yellow":
document.body.style.backgroundColor = "yellow";
break;
default:
document.body.style.backgroundColor = "white";
break;
}
}
</script>
</body>
</html>
b) Develop a JavaScript program to create Rotating Banner Ads. 6M

Ans <html > Correct

<head> logic-6 M
<title>Banner Ads</title>
<script>
Banners = new Array('1.jpg','2.jpg','3.jpg'); OR
CurrentBanner = 0; ( any other
function DisplayBanners() relevant
{ logic can be
if (document.images); considered )
{
CurrentBanner++;
if (CurrentBanner == Banners.length)
{
CurrentBanner = 0;

Page No: 20 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
}
document.RotateBanner.src= Banners[CurrentBanner];
setTimeout("DisplayBanners()",1000);
}
}
</script>
</head>
<body onload="DisplayBanners()" >
<center>
<img src="1.jpg" width="400"
height="75" name="RotateBanner" />
</center>
</body>
</html>

c) Write a JavaScript for the folding tree menu. 6M

Ans <html> Correct

<head> logic-6 M
<style>
ul, #myUL {
list-style-type: none;
OR
}
( any other
.caret::before {
relevant
content: "\25B6";
logic can be
color: black;
considered )
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>
Page No: 21 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
<p>Click on the arrow(s) to open or close the tree branches.</p>

<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>

Page No: 22 | 22
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

WINTER – 19 EXAMINATIONS
Subject Name: Client Side Scripting Model Answer Subject Code: 22519
Important Instructions to examiners:
1) The answers should be examined by key words and not as word-to-word as given in
the model answer scheme.
2) The model answer and the answer written by candidate may vary but the examiner
may try to assess the understanding level of the candidate.
3) The language errors such as grammatical, spelling errors should not be given more
Importance (Not applicable for subject English and Communication Skills.
4) While assessing figures, examiner may give credit for principal components
indicated in the figure. The figures drawn by candidate and model answer may vary.
The examiner may give credit for any equivalent figure drawn.
5) Credits may be given step wise for numerical problems. In some cases, the assumed
constant values may vary and there may be some difference in the candidate’s
answers and model answer.
6) In case of some questions credit may be given by judgement on part of examiner of
relevant answer based on candidate’s understanding.
7) For programming language papers, credit may be given to any other program based
on equivalent concept.

Q. Sub Answer Marking

No. Q. Scheme
N.
1 Attempt any FIVE of the following : 10 M
a List any four features of Java script. 2M
Ans Features of Java script Any four
features : ½
1. JavaScript is a object-based scripting language. M each
2. Giving the user more control over the browser.
3. It Handling dates and time.
4. It Detecting the user's browser and OS,
5. It is light weighted.
6. Client – Side Technology
7. JavaScript is a scripting language and it is not java.
8. JavaScript is interpreter based scripting language.
9. JavaScript is case sensitive.
10. JavaScript is object based language as it provides predefined objects.
11. Every statement in javascript must be terminated with semicolon (;).
12. Most of the javascript control statements syntax is same as syntax of
control statements in C language.
13. An important part of JavaScript is the ability to create new functions
within scripts. Declare a function in JavaScript
using function keyword.
b List the comparison operators in Java script. 2M

Page 1 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

Ans Comparison operators in Java script Any 4

operators
== Equal to :1/2 M each
!= Not equal to
> Greater than
< Less than
>= Greater than or equal to
<= Less than or equal to
=== Equal value and equal
type
!== not equal value or not
equal type
c Write a Java script to create person object with properties firstname, 2M
lastname, age, eyecolor, delete eyecolor property and display remaining
properties of person object.
Ans <html> Create
person
<body> object : 1M
<script>

var person = {
firstname:"John",
lastname:"Doe",
age:50,
eyecolor:"blue"
}; Delete and
display
delete person.eyecolor; //delete person eyecolor
properties :
document.write("After delete "+ person.firstname +" "+ person.lastname +" " 1M
+person.age +" "+ person.eyecolor);
</script>

</body>
</html>
d Write a Java script that initializes an array called flowers with the names of 2M
3 flowers. The script then displays array elements.
Ans <html> Initialization
of array :
<head> 1M,

Page 2 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

<title>Display Array Elements</title>

</head> Display of
array
<body> elements :
1M
<script>
var flowers = new Array();
flowers[0] = 'Rose ';

flowers[1] = 'Mogra';
flowers[2] = 'Hibiscus';
for (var i = 0; i < flowers.length; i++)
{
document.write(flowers[i] + '<br>');
}
</script>

</body>
</html>
e Write Javascript to call function from HTML. 2M
Ans <html> Function
declaration :
<head> 1M,
<title>Calling function from HTML</title>
<script> Function
call from
function welcome()
HTML: 1M
{
alert("Welcome students");
(Any other
} example
allowed)
function goodbye()
{

alert("Bye");

Page 3 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

}
</script>
</head>
<body onload="welcome()" onunload="goodbye()">
</body>
</html>
f Write a Javascript to design a form to accept values for user ID & password. 2M
Ans <html> Correct
syntax: 1M,
<body>
<form name="login">
Correct
Enter Username<input type="text" name="userid"><br> logic: 1M
Enter Password<input type="password" name="pswrd">
<input type="button" onclick="display()" value="Display">
</form>

Page 4 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

6. pathname
7. port
8. protocol
9. search
Any 2
Methods of location object: methods : ½
M each
1. assign( )
2. reload( )
3. replace( )

2 Attempt any THREE of the following : 12 M

a Explain getter and setter properties in Java script with suitable example. 4M
Ans Property getters and setters Explanation
1. The accessor properties. They are essentially functions that work on : 2M
getting and setting a value.
2. Accessor properties are represented by “getter” and “setter” methods. In
an object literal they are denoted by get and set.
let obj = {
get propName() {
// getter, the code executed on getting obj.propName
},

set propName(value) {
// setter, the code executed on setting obj.propName = value
}
};

3. An object property is a name, a value and a set of attributes. The value

may be replaced by one or two methods, known as setter and a getter.
4. When program queries the value of an accessor property, Javascript
invoke getter method(passing no arguments). The retuen value of this
method become the value of the property access expression.
5. When program sets the value of an accessor property. Javascript invoke
the setter method, passing the value of right-hand side of assignment. This
method is responsible for setting the property value.
 If property has both getter and a setter method, it is read/write
property.
 If property has only a getter method , it is read-only property.
 If property has only a setter method , it is a write-only property.
6. getter works when obj.propName is read, the setter – when it is assigned.

Example:
<html>

Page 5 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

<head>
<title>Functions</title>
<body> Example :
<script language="Javascript"> 2M
var myCar = {
/* Data properties */
defColor: "blue",
defMake: "Toyota",
(Any other
/* Accessor properties (getters) */ example can
get color() { be
return this.defColor; considered)
},
get make() {
return this.defMake;
},

/* Accessor properties (setters) */

set color(newColor) {
this.defColor = newColor;
},
set make(newMake) {
this.defMake = newMake;
}
};
document.write("Car color:" + myCar.color + " Car Make: "+myCar.make)
/* Calling the setter accessor properties */
myCar.color = "red";
myCar.make = "Audi";
/* Checking the new values with the getter accessor properties */
document.write("<p>Car color:" + myCar.color); // red
document.write(" Car Make: "+myCar.make); //Audi
</script>
</head>
</body>
</html>
b Explain prompt() and confirm() method of Java script with syntax and 4M
example.
Ans prompt() For Each
explanation/
The prompt () method displays a dialog box that prompts the visitor for input.The
prompt () method returns the input value if the user clicks "OK". If the user clicks syntax : 1M,
"cancel" the method returns null.
Example :
Syntax: window.prompt (text, defaultText) 1M

Page 6 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

Example: (Any other

<html> example can
<script type="text/javascript"> be
considered)
function msg(){
var v= prompt("Who are you?");
alert("I am "+v);
}
</script>

<input type="button" value="click" onclick="msg()"/>

</html>
confirm()
It displays the confirm dialog box. It has message with ok and cancel buttons.
Returns Boolean indicating which button was pressed
Syntax:
window.confirm("sometext");
Example :
<html>
<script type="text/javascript">
function msg(){
var v= confirm("Are u sure?");
if(v==true){
alert("ok");
}

else{
alert("cancel");
}
}
</script>
<input type="button" value="delete record" onclick="msg()"/>

</html>

Page 7 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

c Write a Java script program which computes, the average marks of the 4M
following students then, this average is used to determine the corresponding
grade.
Student Name Marks
Sumit 80
Kalpesh 77
Amit 88
Tejas 93
Abhishek 65

The grades are computed as follows :

Range Grade
<60 E
<70 D
<80 C
<90 B
<100 A
Ans <html> Correct
logic : 2M,
<head>
Correct
<title>Compute the average marks and grade</title> Syntax: 2M
</head> (any other
logic can be
<body>
considered)
<script>
var students = [['Summit', 80], ['Kalpesh', 77], ['Amit', 88], ['Tejas', 93],
['Abhishek', 65]];
var Avgmarks = 0;
for (var i=0; i < students.length; i++) {
Avgmarks += students[i][1];
}
var avg = (Avgmarks/students.length);

document.write("Average grade: " + (Avgmarks)/students.length);

document.write("<br>");
if (avg < 60){

Page 8 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

document.write("Grade : E");
}
else if (avg < 70) {
document.write("Grade : D");
}
else if (avg < 80) {

document.write("Grade : C");
} else if (avg < 90) {
document.write("Grade : B");
} else if (avg < 100) {
document.write("Grade : A");
}
</script>

</body>
</html>

Output (Optional)
Average grade: 80.6
Grade : B
d Write the use of chatAt() and indexof() with syntax and example. 4M
Ans charAt() Each syntax
: 1M,
The charAt() method requires one argument i.e is the index of the character that
you want to copy.

Syntax: Example :
1M
var SingleCharacter = NameOfStringObject.charAt(index);

Example:

var FirstName = 'Bob';

Page 9 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

var Character = FirstName.charAt(0); //o/p B

indexOf()
The indexOf() method returns the index of the character passed to it as an
argument.
If the character is not in the string, this method returns –1.

Syntax:
var indexValue = string.indexOf('character');

Example:
var FirstName = 'Bob';

var IndexValue = FirstName.indexOf('o'); //o/p index as 1

3 Attempt any THREE of the following : 12 M

a Differentiate between concat() and join() methods of array object. 4M
Ans concat() join()

Array elements can be combined by Array elements can be combined by

using concat() method of Array using join() method of Array object.
object.

The concat() method separates each The join() method also uses a comma
value with a comma. to separate values, but you can
specify a character other than a
comma to separate values.

Eg: Eg:
var str = cars.concat() var str = cars.join(' ')
The value of str in this case is
The value of str is 'BMW Audi Maruti'
'BMW, Audi, Maruti'

b Write a JavaScript that will replace following specified value with another 4M
value in string.

Page 10 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

String = “I will fail”

Replace “fail” by “pass”
Ans <html> Correct
program
<head> with any
proper logic:
<body>
4M
<script>
var myStr = ‘I will fail’;
var newStr = myStr.replace(fail, "pass");
document.write(newStr);
</script>

</body>
</head>
</html>

c Write a Java Script code to display 5 elements of array in sorted order. 4M

Ans <html> Correct
program
<head> with any
proper logic
<title> Array</title>
:4M
</head>
<body>

</html>

d Explain open() method of window object with syntax and example. 4M

Page 11 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

Ans The open() method of window object is used to open a new window and loads the Explanation:
document specified by a given URL. 1M
MyWindow = window.open() syntax: 1 M
The open() method returns a reference to the new window, which is assigned to
Example: 2
the MyWindow variable. You then use this reference any time that you want to
do something with the window while your JavaScript runs. M
A window has many properties, such as its width, height, content, and name—to
mention a few. You set these attributes when you create the window by passing
(Any other
them as parameters to the open() method:
example can
be
• The first parameter is the full or relative URL of the web page that will appear
considered)
in the new window.
• The second parameter is the name that you assign to the window.
• The third parameter is a string that contains the style of the window.
We want to open a new window that has a height and a width of 250 pixels and
displays an advertisement that is an image. All other styles are turned off.

Syntax:

MyWindow = window.open(‘webpage1.html’, 'myAdWin', 'status=0, toolbar=0,

location=0, menubar=0, directories=0, resizable=0, height=250, width=250')

Example:

<html >
<head>
<title>Open New Window</title>
<script >
function OpenNewWindow() {
MyWindow = window.open(‘webpage1.html’, 'myAdWin', 'status=0, toolbar=0,
location=0,
menubar=0, directories=0, resizable=0, height=250, width=250')
}
</script>
</head>
<body>
<FORM action=" " method="post">
<INPUT name="OpenWindow" value="Open Window" type="button"
onclick="OpenNewWindow()"/>
</FORM>
</body>
</html>

Page 12 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

4 Attempt any THREE of the following : 12 M

a Describe regular expression. Explain search () method used in regular 4M
expression with suitable example.
Ans Regular Expression: Regular
A regular expression is very similar to a mathematical expression, except a Expression:
regular expression tells the browser how to manipulate text rather than numbers 1M
by using special symbols as operators.
search()
Search() method: method: 1 M
str.search() method takes a regular expression/pattern as argument and search
for the specified regular expression in the string. This method returns the index Example:
where the match found. 2M

Example:

<html>
<body>
<script>
function myFunction() {

// input string
var str = "Good Morning!";

// searching string with modifier i

var n = str.search(/Morning/i);

document.write(n + '<br>');

// searching string without modifier i

var n = str.search(/Morning/);

document.write(n);
}
myFunction();
</script>
</body>
</html>
b List ways of protecting your web page and describe any one of them. 4M
Ans Ways of protecting Web Page: List: 1 M

1)Hiding your source code Explanation

2)Disabling the right MouseButton any one: 3M
3) Hiding JavaScript
4) Concealing E-mail address.

Page 13 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

1) Hiding your source code

The source code for your web page—including your JavaScript—is stored in the
cache, the part of computer memory where the browser stores web pages that
were requested by the visitor. A sophisticated visitor can access the cache and
thereby gain access to the web page source code.
However, you can place obstacles in the way of a potential peeker. First, you can
disable use of the right mouse button on your site so the visitor can't access the
View Source menu option on the context menu. This hides both your HTML code
and your JavaScript from the visitor.
Nevertheless, the visitor can still use the View menu's Source option to display
your source code. In addition, you can store your JavaScript on your web server
instead of building it into your web page. The browser calls the JavaScript from
the web server when it is needed by your web page.
Using this method, the JavaScript isn't visible to the visitor, even if the visitor
views the source code for the web page.

2)Disabling the right MouseButton

The JavaScript begins by defining the BreakInDetected() function. This function

is called any time the visitor clicks the right mouse button while the web page is
displayed. It displays a security violation message in a dialog box whenever a
visitor clicks the right mouse button
The BreakInDetected() function is called if the visitor clicks any button other
than the left mouse button.

Example:

<html>
<head>
<title>Lockout Right Mouse Button</title>
<script language=JavaScript>

function BreakInDetected(){
alert('Security Violation')
return false
}
function NetscapeBrowser(e){
if (document.layers||
document.getElementById&&!document.all){
if (e.which==2||e.which==3){

Page 14 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

BreakInDetected()
return false
}
}
}
function InternetExploreBrowser(){
if (event.button==2){
BreakInDetected()
return false
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN)
document.onmousedown=NetscapeBrowser()
}
else if (document.all&&!document.getElementById){
document.onmousedown=InternetExploreBrowser()
}
document.oncontextmenu=new Function(
"BreakInDetected();return false")

</script>
</head>
<body>
<table width="100%" border=0>
<tbody>
<tr vAlign=top>
<td width=50>
<a>
<ing height=92 src="rose.jpg"
width=70 border=0
onmouseover="src='rose1.jpg'"
onmouseout="src='rose.jpg'">
</a>
</td>
<td>
<img height=1 src="" width=10>
</td>
<td>
<a>
<cTypeface:Bold><u> Rose Flower</U></b>
</a>
</font><font face="arial, helvetica, sans-serif"
size=-1><BR>Rose Flower

Page 15 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

</td>
</tr>
</tbody>
</table>
</body>
</html>

3) Hiding JavaScript

You can hide your JavaScript from a visitor by storing it in an external fi le on

your web server. The external fi le should have the .js fi le 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 fi le, but you won't see the source code for the
JavaScript.
The next example shows how to create and use an external JavaScript file. First
you must tell the browser that the content of the JavaScript is located in an
external
file on the web server rather than built into the web page. You do this by assigning
the fi le name that contains the JavaScripts to the src attribute of the <script>
tag, as shown here:

Next, you need to defi ne empty functions for each function that you define in the
external JavaScript fi le.

<html >
<head>
<title>Using External JavaScript File</title>
<script src="myJavaScript.js" language="Javascript" type="text/javascript">

function OpenNewWindow(book) {
}
</script>
</head>
<body>
<tablewidth="100%" border=0>
<tbody>
<tr vAlign=top>
<td width=50>
<a>
<img height=92 src="rose.jpg" width=70 border=0 name='cover'>
</a>

Page 16 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

</td>
<td>
<img height=1 src="" width=10>
</td>
<td>
<a onmouseover="OpenNewWindow(1)" onmouseout="MyWindow.close()">
<b><u>Rose </u></b>
</a>
<br>
<a onmouseover="OpenNewWindow(2)" onmouseout="MyWindow.close()">
<b><u>Sunflower</U></b>
</a>
<br>
<A onmouseover="OpenNewWindow(3)" onmouseout="MyWindow.close()">
<b><u>Jasmine </u></b>
</a>
</td>
</tr>
</tbody>
</table>
</body>
</html>

The final step is to create the external JavaScript fi le. You do this by placing all
function definitions into a new fi le and then saving the fi le using the .js
extension.
MyJavaScript.js file:

function OpenNewWindow(book) {
if (book== 1)
{
document.cover.src='rose.jpg'
MyWindow = window.open('', 'myAdWin', 'titlebar=0 status=0, toolbar=0,
location=0, menubar=0, directories=0, resizable=0, height=50,
width=150,left=500,top=400')
MyWindow.document.write( 'Rose flower')
}
if (book== 2)
{
document.cover.src='sunflower.jpeg'
MyWindow = window.open('', 'myAdWin', 'titlebar=0 status=0, toolbar=0,
location=0, menubar=0, directories=0, resizable=0, height=50,
width=150,left=500,top=500')
MyWindow.document.write( 'sunflower flower')
}

Page 17 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

if (book== 3)
{
document.cover.src='jasmine.gif'
MyWindow = window.open('', 'myAdWin', 'titlebar=0
status=0, toolbar=0, location=0, menubar=0, directories=0, resizable=0,
height=50,
width=150,left=500,top=600')
MyWindow.document.write( 'Jasmine Flower')
}
}

After you create the external JavaScript fi le, defi ne empty functions for each
function that is contained in the external JavaScript fi le, and reference the
external
JavaScript fi le in the src attribute of the <script> tag, you're all set.

4) Concealing E-mail address:

Many of us have endured spam at some point and have probably blamed every
merchant we ever patronized for selling our e-mail address to spammers. While
e-mail addresses are commodities, it's likely that we ourselves are the culprits
who invited spammers to steal our e-mail addresses.
Here's what happens: Some spammers create programs called bots that surf the
Net looking for e-mail addresses that are embedded into web pages, such as those
placed there by developers to enable visitors to contact them. The bots then strip
these e-mail addresses from the web page and store them for use in a spam attack.
This technique places developers between a rock and a hard place. If they place
their e-mail addresses on the web page, they might get slammed by spammers. If
they don't display their e-mail addresses, visitors will not be able to get in touch
with the developers.
The solution to this common problem is to conceal your e-mail address in the
source code of your web page so that bots can't fi nd it but so that it still appears
on the web page. Typically, bots identify e-mail addresses in two ways: by the
mailto: attribute that tells the browser the e-mail address to use when the visitor
wants to respond to the web page, and by the @ sign that is required of all e-mail
addresses. Your job is to confuse the bots by using a JavaScript to generate the
e-mail address dynamically. However, you'll still need to conceal the e-mail
address in your JavaScript, unless the JavaScript is contained in an external
JavaScript file, because a bot can easily recognize the mailto: attribute and the @
sign in a JavaScript.
Bots can also easily recognize when an external fi le is referenced. To conceal an
e-mail address, you need to create strings that contain part of the e-mail address
and then build a JavaScript that assembles those strings into the e-mail address,
which is then written to the web page.
The following example illustrates one of many ways to conceal an e-mail address.

Page 18 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

It also shows you how to write the subject line of the e-mail. We begin by
creating four strings:

• The first string contains the addressee and the domain along with symbols &, *,
and _ (underscore) to confuse the bot.
• The second and third strings contain portions of the mailto: attribute name.
Remember that the bot is likely looking for mailto:.
• 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.
All the strings are then concatenated and assigned to the variable b, which is then
assigned the location attribute of the window object. This calls the e-mail program
on the visitor's computer and populates the TO and Subject lines with the strings
generated by the JavaScript.

<html>
<head>
<title>Conceal Email Address</title>
<script>
function CreateEmailAddress(){
var x = manish*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="Help"
onclick="CreateEmailAddress()">
</body>
</html>

Page 19 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

c Create a slideshow with the group of three images, also simulate next and 4M
previous transition between slides in your Java Script.
Ans <html> Correct
<head> program: 4
<script> M
pics = new Array('1.jpg' , '2.jpg' , '3.jpg');
count = 0; (Any other
function slideshow(status) example can
{ be
if (document.images) considered)
{
count = count + status;
if (count > (pics.length - 1))
{
count = 0;
}
if (count < 0)
{
count = pics.length - 1;
}
documet.imag1.src = pics[count];
}
}
</script>
</head>
<body>
<img src="1.jpg" width="200" name="img1">
<br>
<input type="button" value="Next" onclick="slideshow(1)">
<input type="button" value="Back" onclick="slideshow(-1)">
</body>
</html>
d Explain text rollover with suitable example. 4M
Ans You create a rollover for text by using the onmouseover attribute of the <A> tag, Explanation:
which is the anchor tag. You assign the action to the onmouseover attribute the 2M
same way as you do with an <IMG> tag. Program: 2
Let's start a rollover project that displays a flower titles. Additional information M
about a flower can be displayed when the user rolls the mouse cursor over the
flower name. In this example, the image of the flower is displayed. However, (Any other
you could replace the flower image with an advertisement or another message example can
that you want to show about the flower. be
considered)
<html>
<head>
<title>Rollover Text</title>

Page 20 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

</head>
<body>
<TABLE width="100%" border="0">
<TBODY>
<TR vAlign="top">
<TD width="50">
<a>
<IMG height="92" src="rose.jpg"
width="70" border="0" name="cover">
</a>
</TD>
<TD>
<IMG height="1" src="" width="10">
</TD>
<TD>
<A onmouseover= "document.cover.src='sunflower.jpg'">
<B><U>Sunflower</U></B>
</A>
<BR>
<A onmouseover=
"document.cover.src='jasmine.jpg'">
<B><U>Jasmine</U></B>
</A>
<BR>
<A onmouseover=
"document.cover.src='rose.jpg'">
<B><U>Rose</U></B>
</A>
</TD>
</TR>
</TBODY>
</TABLE>
</body>
</html>
e Write a Java script to modify the status bar using on MouseOver and on 4M
MouseOut with links. When the user moves his mouse over the links, it will
display “MSBTE” in the status bar. When the user moves his mouse away
from the link the status bar will display nothing.
Ans <html> Correct
<head> program: 4
<title>JavaScript Status Bar</title></head> M
<body>
<a href=" https://msbte.org.in/"
onMouseOver="window.status='MSBTE';return true"
onMouseOut="window.status='';return true">

Page 21 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

MSBTE

</a>
</body>
</html>

5 Attempt any TWO of the following : 12 M

a Write a HTML script which displays 2 radio buttons to the users for fruits 6M
and vegetables and 1 option list. When user select fruits radio button option
list should present only fruits names to the user & when user select vegetable
radio button option list should present only vegetable names to the user.
Ans <html> Correct
<head> script code:
<title>HTML Form</title> 4M
<script language="javascript" type="text/javascript"> HTML
function updateList(ElementValue) code: 2M
{
with(document.forms.myform)
{
if(ElementValue == 1)
{
optionList[0].text="Mango";
optionList[0].value=1;
optionList[1].text="Banana";
optionList[1].value=2;
optionList[2].text="Apple";
optionList[2].value=3;
}
if(ElementValue == 2)
{
optionList[0].text="Potato";
optionList[0].value=1;
optionList[1].text="Cabbage";
optionList[1].value=2;
optionList[2].text="Onion";
optionList[2].value=3;
}
}
}
</script>
</head>
<body>
<form name="myform" action="" method="post">
<p>

Page 22 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

<select name="optionList" size="2">

<option value=1>Mango
<option value=2>Banana
<option value=3>Apple
</select>
<br>
<input type="radio" name="grp1" value=1 checked="true"
onclick="updateList(this.value)">Fruits
<input type="radio" name="grp1" value=2
onclick="updateList(this.value)">Vegetables
<br>
<input name="Reset" value="Reset" type="reset">
</p>
</form>
</body>
</html>
b Describe, how to read cookie value and write a cookie value. Explain with 6M
example.
Ans Web Browsers and Servers use HTTP protocol to communicate and HTTP is a Reading
stateless protocol. But for a commercial website, it is required to maintain cookie with
session information among different pages. For example, one user registration example:
ends after completing many pages. But how to maintain users' session 3M
information across all the web pages. Writing
cookie with
Cookies are a plain text data record of 5 variable-length fields − example:
 Expires − The date the cookie will expire. If this is blank, the cookie will 3M
expire when the visitor quits the browser. **Note:
Combined of
 Domain − The domain name of your site. both code is
 Path − The path to the directory or web page that set the cookie. This also
may be blank if you want to retrieve the cookie from any directory or acceptable
page.
 Secure − If this field contains the word "secure", then the cookie may
only be retrieved with a secure server. If this field is blank, no such
restriction exists.
 Name=Value − Cookies are set and retrieved in the form of key-value
pairs
Cookies were originally designed for CGI programming. The data contained in
a cookie is automatically transmitted between the web browser and the web
server, so CGI scripts on the server can read and write cookie values that are
stored on the client.

Page 23 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

JavaScript can also manipulate cookies using the cookie property of

the Document object. JavaScript can read, create, modify, and delete the cookies
that apply to the current web page.

Storing Cookies
The simplest way to create a cookie is to assign a string value to the
document.cookie object, which looks like this.
document.cookie = "key1 = value1;key2 = value2;expires = date";
Here the expires attribute is optional. If you provide this attribute with a valid
date or time, then the cookie will expire on a given date or time and thereafter,
the cookies' value will not be accessible.
<html>
<head>
<script type = "text/javascript">

</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie();"/>
</form>
</body>
</html>

Reading Cookies
Reading a cookie is just as simple as writing one, because the value of the
document.cookie object is the cookie. So you can use this string whenever you
want to access the cookie. The document.cookie string will keep a list of
name=value pairs separated by semicolons, where name is the name of a cookie
and value is its string value.

Page 24 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

You can use strings' split() function to break a string into key and values as
follows:-
<html>
<head>
<script type = "text/javascript">
<!--
function ReadCookie()
{
var allcookies = document.cookie;
document.write ("All Cookies : " + allcookies )
// Get all the cookies pairs in an array
cookiearray = allcookies.split(';');

// Now take key value pair out of this array

for(var i=0; i<cookiearray.length; i++) {
name = cookiearray[i].split('=')[0];
value = cookiearray[i].split('=')[1];
document.write ("Key is : " + name + " and Value is : " + value);
}
}
//-->
</script>

</head>
<body>

<form name = "myform" action = "">

<p> click the following button and see the result:</p>
<input type = "button" value = "Get Cookie" onclick =
"ReadCookie()"/>
</form>

Page 25 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

</body>
</html>
c Write a java script that displays textboxes for accepting name & email ID & 6M
a submit button. Write java script code such that when the user clicks on
submit button
(1) Name Validation
(2) Email ID Validation.
Ans <html> Correct
<head> Html code:
<title>Form Validation</title> 2M
</head>
<body> Correct
<form action = "/cgi-bin/test.cgi" name = "myForm" onsubmit = Script code:
"return(validate());"> 4M
<table cellspacing = "2" cellpadding = "2" border = "1">
(Any other
<tr>
example can
<td align = "right">Name</td>
be
<td><input type = "text" name = "Name" /></td>
considered)
</tr>

<tr>
<td align = "right">EMail</td>
<td><input type = "text" name = "EMail" /></td>
</tr>

<tr>
<td align = "right"></td>
<td><input type = "submit" value = "Submit" /></td>
</tr>
</table>
</form>
</body>
</html>
<script type = "text/javascript">
<!--
// Form validation code will come here.
function validate() {
if( document.myForm.Name.value == "" ) {
alert( "Please provide your name!" );
document.myForm.Name.focus() ;
return false;
}
if( document.myForm.EMail.value == "" ) {

Page 26 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

alert( "Please provide your Email!" );

document.myForm.EMail.focus() ;
return false;
}
var emailID = document.myForm.EMail.value;
atpos = emailID.indexOf("@");
dotpos = emailID.lastIndexOf(".");

if (atpos < 1 || ( dotpos - atpos < 2 )) {

alert("Please enter correct email ID")
document.myForm.EMail.focus() ;
return false;
}
return( true );
}
//-->
</script>

6 Attempt any TWO of the following : 12 M

a Describe how to evaluate checkbox selection. Explain with suitable example. 6M
Ans Evaluating Checkbox Selection: Correct
Explanation
 A checkbox is created by using the input element with the : 3M
type=”checkbox” attribute-value pair.
 A checkbox in a form has only two states(checked or un-checked) and is &
independent of the state of other checkboxes in the form. Check boxes can
be grouped together under a common name. Correct
Example:3M
 You can write javascript function that evaluates whether or not a check
box was selected and then processes the result according to the needs of
(Any other
your application.
example can
 Following example make use of five checkboxes to provide five options
be
to the user regarding fruit.
considered)
<html>
<head>
<title>HTML Form</title>
<script language="javascript" type="text/javascript">
function selection()
{
var x ="You selected: ";
with(document.forms.myform)
{
if(a.checked == true)
{
x+= a.value+ " ";

Page 27 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

}
if(b.checked == true)
{
x+= b.value+ " ";
}
if(o.checked == true)
{
x+= o.value+ " ";
}
if(p.checked == true)
{
x+= p.value+ " ";
}
if(g.checked == true)
{
x+= g.value+ " ";
}
document.write(x);
}
}
</script>
</head>
<body>
<form name="myform" action="" method="post">
Select Your Favourite Fruits: <br>
<input type="checkbox" name="a" value="Apple">Apple
<input type="checkbox" name="b" value="Banana">Banana
<input type="checkbox" name="o" value="Orange">Orange
<input type="checkbox" name="p" value="Pear">Pear
<input type="checkbox" name="g" value="Grapes">Grapes
<input type="reset" value="Show" onclick="selection()">
</form>
</body>
</html>

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

Page 28 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

b Write a script for creating following frame structure 6M

FRUITS, FLOWERS AND CITIES are links to the webpage fruits.html,

flowers.html, cities.html respectively. When these links are clicked
corresponding data appears in FRAME 3.
Ans <html> Frame part:
<head> 2M for each
<title>Frame Demo</title>
</head>
<body>
<table border="1">
<tr>
<td align="center" colspan="2">
FRAME 1
</td>
</tr>
<tr>
<td>
FRAME 2
<ul>
<li>
<a href="fruits.html" target="mainframe">FRUITS</a>
</li>
<li>
<a href="flowers.html" target="mainframe">FLOWERS</a>
</li>
<li>
<a href="cities.html" target="mainframe">CITIES</a>
</li>
</ul>
</td>
<td>
FRAME 3<BR>
<iframe name="mainframe"></iframe>
</td>
</tr>
</table>
</body>
</html>

Page 29 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)

c Write a javascript to create a pull-down menu with three options [Google, 6M

MSBTE, Yahoo] once the user will select one of the options then user will be
redirected to that site.
Ans <html> pull-down
<head> menu code:
<title>HTML Form</title> 2M each
<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.yahoo.com">Yahoo</option>
</form>
</body>
</html>

Page 30 |3 0
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Important Instructions to examiners:

1) The answers should be examined by key words and not as word-to-word as given
in the model answer scheme.
2) The model answer and the answer written by candidate may vary but the examiner
may try to assess the understanding level of the candidate.
3) The language errors such as grammatical, spelling errors should not be given more
Importance (Not applicable for subject English and Communication Skills.
4) While assessing figures, examiner may give credit for principal components
indicated in the figure. The figures drawn by candidate and model answer may
vary. The examiner may give credit for any equivalent figure drawn.
5) Credits may be given step wise for numerical problems. In some cases, the
assumed constant values may vary and there may be some difference in the
candidate’s answers and model answer.
6) In case of some questions credit may be given by judgement on part of examiner
of relevant answer based on candidate’s understanding.
7) For programming language papers, credit may be given to any other program
based on equivalent concept.
8) As per the policy decision of Maharashtra State Government, teaching in
English/Marathi and Bilingual (English + Marathi) medium is introduced at first year
of AICTE diploma Programme from academic year 2021-2022. Hence if the
students in first year (first and second semesters) write answers in Marathi or
bilingual language (English +Marathi), the Examiner shall consider the same and
assess the answer based on matching of concepts with model answer.

Q. Sub Answer Marking

No Q.N. Scheme

1. Attempt any FIVE of the following: 10

a) Write features of JavaScript 2M
Ans. 1. It is an object-based scripting language. Any 2 features
1M each
2. It gives the user more control over the browser.
3. It is light weighted.
4. Client – Side Technology
5. JavaScript is interpreter based scripting language.
6. JavaScript is case sensitive.
7. JavaScript is object based language as it provides predefined
objects.
b) List and describe any four methods of Math object 2M

Page 1 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Ans. Math. round(value)- It returns value rounded to its nearest integer.

Any 4 methods
Math.ceil(value)- It returns value rounded up to its nearest integer. 1/2M each
Math.floor(value)- It returns value rounded down to its nearest
integer.
Math.trunc(Value)- It returns value as integer part of value.
Math.pow (number, power)- It returns value as power of specified
number.
Math.sqrt(value)- It returns square root of value.
Math.abs(value)- It returns absolute –positive value for given value.
Math.min ()- It returns lowest value in a list of values.
Math.max ()- It returns highest value in a list of values.

c) Write a JavaScript program that will print even numbers from 1 2M

to 20 Correct
Ans. Note: Any other relevant logic shall be considered program 2M
<html>
<body>
<script type="text/javascript">
vari;
for(i=1; i<=20;i++)
{
if(i%2==0)
{
document.write(i+"<br>");
}
}
</script>
</body>
</html>
d) Write a JavaScript program to display the elements of array in 2M
ascending and descending order.
Ans. Note: Any other relevant logic shall be considered Correct
program
<script> 2M
function func()
{
Page 2 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

let arr = [45,12,32,78]

document.write("Original Array="+arr);
document.write("<br>Sorted Array="+arr.sort());
document.write("<br>Reverse Array="+arr.reverse());
}
func();
</script>
e) Give syntax of and explain function in JavaScript with suitable 2M
example
Ans. Function is a collection of one or more statements written to execute Explanation
1M
a specific task.
Syntax 1M
Syntax to define a function:
function function_name([Arguments])
{
Statement block;
[return statement;]
}
Example:
function display ( )
{
alert (―WELCOME TO JAVASCRIPT‖);
}
f) Enlist and explain any two mouse events. 2M
Ans. onclickevent: This event occurs when a mouse button is clicked on
or over a form element.
Example:<input type=‖text‖ onclick=‖ function ()‖>
Any two
mouse events
ondblclickevent: This event occurs when a mouse button is double with
clicked on or over a form element. explanation
Example:<input type=‖text‖ ondblclick=‖ function ()‖> 1M each

onmousedownevent: This event executes when a mouse button is

clicked while cursor is over an element.
Example:<input type=‖text‖ onmousedown=‖ function ()‖>

Page 3 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

onmouseupevent: This event executes when a mouse button is

released while the cursor is over an element.
Example:<input type=‖text‖ onmouseup=‖ function ()‖>

onmouseoverevent: This event executes when mouse cursor moves

onto an element.
Example:<input type=‖text‖ onmouseover=‖ function ()‖>

onmousemoveevent: This event executes when mouse cursor is

moved while over an element.
Example:<input type=‖text‖ onmousemove=‖ function ()‖>

onmouseoutevent: This event executes when mouse cursor is

moved away from an element.
Example:<input type=‖text‖ onmouseout=‖ function ()‖>

g) Explain the term JavaScript URL 2M

Ans. A URL (Uniform Resource Locator) is the address of a unique
Correct
resource on the internet. It is one of the key mechanisms used explanation
by browsers to retrieve published resources, such as HTML pages, 2M
CSS documents, images, and so on.
Examples of URLs:
https://developer.mozilla.org/en-US/docs/Learn/
https://developer.mozilla.org/en-US/search?q=URL

2. Attempt any THREE of the following: 12

a) State the use of Object, Method and Property in JavaScript 4M
Ans. Object: In JavaScript, almost everything is an object. In JavaScript,
an object is used to represent standalone entity, with properties and Correct use of
type. Each object has its unique identity based on fields, buttons, all terms
4M
interface elements, etc.
For example, two forms placed on web page can have different
elements and interface with respect to their use. So, each form can
have unique name or id that can be referenced by JavaScript.

Page 4 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Property: A property is a value that is associated with an object. The

properties of an object are used to define the characteristics of the
object. You access the properties of an object with a simple dot-
notation.
For example, A form object in a web page can have properties like
width, height, etc.

Method: A method is used to define a function associated with an

object to perform a specific task. Methods are defined the way
normal functions are defined, except that they have to be assigned as
the property of an object.
For example, A submit button placed on a form is an object. Clicking
on submit button causes the button to process a method i.e. when a
click event occurs an action is performed and method executes.
b) Explain setter and getter properties in JavaScript with the help 4M
of suitable example
Ans. Property getters and setters
1. The accessor properties. They are essentially functions that work
on getting and setting a value. Explanation
2. Accessor properties are represented by ―getter‖ and ―setter‖ of setter with
methods. In an object literal they are denoted by get and set. example 2M
get –It is used to define a getter method to get the property value
set –It is used to define a setter method to set / change the property
value
let obj =
{
get propName() {
// getter, the code executed on getting obj.propName
},
set propName(value) {
// setter, the code executed on setting obj.propName = value
}
}; Explanation
of getter with
3. An object property is a name, a value and a set of attributes. The example 2M
value may be replaced by one or two methods, known as setter and a
getter.
Example of getter
const student
{

Page 5 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

firstname: ‗abc‘,
get getname()
{
return this.firstname;
}
};

Example of setter

const student
{
firstname: ‗abc‘,
set changename(nm)
{
this.firstname=nm;
}
};
c) Write a JavaScript program to check whether a number is 4M
positive, negative or zero using switch case.
Ans. Note: Any other relevant logic shall be considered. Correct logic
2M
<html>
<body>
<script type="text/javascript"> Correct syntax
var num=prompt("Enter number"); 2M
switch (Math.sign(num))
{
case 1:
alert("The number is Positive");
break;
case -1:
alert("The number is Negative");
break;
default:
alert("The number is Zero");
}
</script>
</body>
</html>

Page 6 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

d) State the use of following methods: 4M

i) charCodeAt( ) Use of each
ii) fromCharCode ( ) method
2M
1. charCodeAt( ): This method is used to return a unicode of
Ans.
specified character.
Syntax: var code=letter.charCodeAt( );
Example: var ch=‘a‘;
document.write(ch.charCodeAt( ));

Output: 97

2. fromCharCode( ): This method is used to return a character for

specified code.
Syntax: var character=String.fromCharCode(code);
Example: var character=String.fromCharCode(97);
Document.write(ch);

Output: a

3. Attempt any THREE of the following: 12

a) Explain Associative arrays in detail. 4M
Ans. Associative arrays are basically objects in JavaScript where indexes
are replaced by user-defined keys. Correct
Syntax: var arr = {key1:'value1', key2:'value2'} explanation
Here, arr, is an associative array with key1, key2 being its keys or 4M
string indexes and value1 & value 2 are its elements.
Example: var arr = { "Company Name": ‗Flexiple‘, "ID": 123};

The content or values of associative arrays is accessed by keys. An

associative array is an array with string keys rather than numeric
keys.
For example:
var arrAssociative = {
"Company Name": 'Flexiple',
"ID": 123
};

Page 7 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

var arrNormal = ["Flexiple", 123];

Here, the keys of the associative array are ―Company Name‖ & ―ID‖
whereas in the normal array. The keys or index is 0 & 1.
b) Write a JavaScript function that checks whether a passed string 4M
is palindrome or not.
Ans. Correct logic
Note: Any other relevant logic shall be considered 2M
function isPalindrome(str) {
str = str.replace(/[^A-Za-z0-9]/g, '').toLowerCase(); Correct syntax
2M
return str === str.split('').reverse().join('');
}
console.log(isPalindrome("A man, a plan, a canal, Panama")); //
Output: true
console.log(isPalindrome("racecar")); // Output: true
console.log(isPalindrome("hello")); // Output: false

c) Explain how to add and sort elements in array with suitable 4M

example.
Ans. Adding Elements to an Array:
In JavaScript, you can add elements to an array using various Explanation
of adding
methods, such as push(), unshift(), or direct assignment to a specific elements with
index. suitable
example
Using push():
The push() method adds one or more elements to the end of an array Any one
and returns the new length of the array. method
2M
Using unshift():
The unshift() method adds one or more elements to the beginning of
an array and returns the new length of the array.
Using splice():
This method can be used to add new items to an array, and removes
elements from an array.
Syntax:
arr.splice(start_index,removed_elements,list_of_elemnts_to_be_add
ed);

Page 8 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Parameter:
•The first parameter defines the position where new elements should
be added (spliced in).
•The second parameter defines how many elements should be
removed.
•The list_of_elemnts_to_be_added parameter define the new
elements to be added(optional).

Using length property:

The length property provides an easy way to append a new element
to an array.
Example
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.write(fruits+"<br>");
fruits[fruits.length] = "Kiwi";
document.write(fruits+"<br>");
fruits[fruits.length] = "Chikoo";
document.write(fruits);
</script>
Sorting Elements in an Array:
Explanation
JavaScript provides the sort() method to sort the elements of an array
of sorting
in place and returns the sorted array. elements with
Example suitable
example
let numbers = [5, 2, 8, 1, 4]; 2M
numbers.push(7);
console.log("Array before sorting:", numbers);
numbers.sort((a, b) => a - b);
console.log("Array after sorting:", numbers);
d) Explain the term browser location and history in details. 4M
Ans. Window Location Object:
In JavaScript, the window.location object represents the current
URL of the browser window. It provides properties and methods to
manipulate the URL.

Page 9 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Explanation
window.location.href:
of location
Returns the complete URL of the current page. 2M
window.location.hostname:
Returns the domain name of the web server.
window.location.pathname:
Returns the path and filename of the current page.
window.location.protocol:
Returns the protocol (HTTP, HTTPS, etc.) of the current page.
window.location.assign(url):
Loads the specified URL.
window.location.reload(forceReload):
Reloads the current page.
// Example: Changing browser location
window.location.href = "https://example.com/page2";
Explanation
Window History of history 2M
The window.history object can be written without the window
prefix.
To protect the privacy of the users, there are limitations to how
JavaScript can access this object.
Some methods:
history.back() - same as clicking back in the browser
history.forward() - same as clicking forward in the browser
Window History Back
The history.back() method loads the previous URL in the history
list.
This is the same as clicking the Back button in the browser.
Example:
<html>
<head>
<script>
function goBack() {
window.history.back()
}

Page 10 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

</script>
</head>
<body>
<input type="button" value="Back" onclick="goBack()">
</body>
</html>
4. Attempt any THREE of the following: 12
a) State what is frame? Explain how it can be created with suitable 4M
example.
Ans. Note: Explanation of either <frameset> , <frame> or <iframe>
shall be considered. Definition
A frame refers to an HTML element that allows the display of 1M
another HTML document within the current web page. Frames are
Explanation
implemented using the <frameset>, <frame> and <iframe> (Inline with example
Frame) element in HTML. 3M

Frames are used to divide browser window into multiple sections

where each section is treated as window that can have independent
contents. A frame can load separate HTML document in each frame
in a window.

<frameset> tag : A frameset is defined as a set of frames inserted in

an HTML web page. These frames can be in the form of rows and
columns in different size. Frameset tells the browser how to divide
the screen into multiple areas.
<frameset> ... </frameset>

Attributes:
cols=”pixels/percentage” Specify number and size of
columns in a frameset. Default
value is 100% (1 column).
rows=”pixels/percentage” Specify number and size of rows in
a frameset. Default value is 100%
(1 row).

<frame> tag : Frame tag is used to insert web page content in a

frame. It is an empty tag.

Page 11 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Attributes:
src=”URL” Specify address of a web page to be
displayed in a frame.
name=” string” Specify name of the frame which can
be used as target to open a link.

Code:
<html>
<frameset cols="25%,75%" >
<frame src="page1.html" name="f1">
<frame src="page2.html" name="f2">
</frameset>
</html>

OR
Creating Frames with <iframe> in HTML:
To create a frame using the <iframe> element, you specify the URL
of the document you want to embed as the value of the src attribute.
Cross-Origin Restrictions: When embedding content from external
sources, cross-origin restrictions may apply. This means that the
embedded content must be served with appropriate CORS (Cross-
Origin Resource Sharing) headers to allow it to be displayed within
the frame.

Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Frame Example</title>
<style>
/* Style the iframe */
iframe {

Page 12 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

width: 100%;
height: 300px; /* Set the height as desired */
border: 1px solid #ccc; /* Add a border for clarity */
}
</style>
</head>
<body>

<iframesrc="https://www.example.com"></iframe>
</body>
</html>
b) Explain the steps to create floating menu and chain select menu 4M
Ans. A floating menu is a menu that remains visible as the user scrolls
Correct steps
down a web page. It's often used for navigation or providing quick of each 2M
access to important content. Here's how you can create one:
HTML Structure: Create the HTML structure for the menu. This
typically involves using <nav> or <div> elements for the menu
container, and <ul> and <li> elements for the menu items.
CSS Styling: Use CSS to style the menu and make it float on the
page. You can use position: fixed to fix the menu in place and top,
bottom, left, or right properties to position it relative to the viewport.
JavaScript (Optional): You can enhance the functionality of the
floating menu with JavaScript. For example, you can add smooth
scrolling to anchor links within the menu, or you can add animations
to make the menu appear or disappear dynamically.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Floating Menu Example</title>
<style>

Page 13 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

/* CSS styles for the floating menu */

.floating-menu {
position: fixed;
top: 0;
left: 0;
background-color: #333;
padding: 10px;
width: 100%;
z-index: 1000; /* Ensure it's above other content */
}
.menu-item {
display: inline-block;
margin-right: 10px;
color: #fff;
text-decoration: none;
}
</style>
</head>
<body>
<nav class="floating-menu">
<ul>
<li class="menu-item"><a href="#section1">Section 1</a></li>
<li class="menu-item"><a href="#section2">Section 2</a></li>

</ul>
</nav>
<section id="section1">
<h2>Section 1</h2>
<p>This is the content of section 1.</p>
</section>
<section id="section2">
<h2>Section 2</h2>
<p>This is the content of section 2.</p>

Page 14 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

</section>
</body>
</html>

Chained Select Menu:

A chained select menu, also known as a dependent or cascading
select menu, consists of multiple dropdown menus where the options
in one dropdown menu depend on the selection made in another
dropdown menu.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Chained Select Menu Example</title>
</head>
<body>
<label for="country">Country:</label>
<select id="country">
<option value="">Select a country</option>
<option value="usa">USA</option>
<option value="uk">UK</option>
</select>

<label for="city">City:</label>
<select id="city" disabled>
<option value="">Select a city</option>
</select>
<script>

// JavaScript code to handle the chained select menu

constcountrySelect = document.getElementById('country');

Page 15 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

constcitySelect = document.getElementById('city');

// Data source (for demonstration purposes)

constcitiesByCountry = {
'usa': ['New York', 'Los Angeles', 'Chicago'],
'uk': ['London', 'Manchester', 'Birmingham']
};

countrySelect.addEventListener('change', function() {
constselectedCountry = this.value;
if (selectedCountry) {
citySelect.innerHTML = '';
const cities = citiesByCountry[selectedCountry];
if (cities) {
citySelect.disabled = false;
citySelect.innerHTML += '<option value="">Select a city</option>';
cities.forEach(city => {
citySelect.innerHTML += `<option
value="${city}">${city}</option>`;
});
} else {
citySelect.disabled = true;
}
} else {
citySelect.disabled = true;
citySelect.innerHTML = '<option value="">Select a city</option>';
}
});
</script>
</body>
</html>
c) Explain how to use banners for displaying advertisement. 4M
Ans. Following are the steps to insert banner advertisement in webpage.

Page 16 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

1) Create banner advertisement using a graphics tool such as Correct

explanation
PhototShop, Paint, etc. 4M
2) Create an <img> element in web page with height and width to
display banner advertisement.
3) Build JavaScript that loads and display banner advertisements.
<html>
<head>
<title>Banner Advertisements</title>
</head>
<body bgcolor="#EEEEEE">
<a href="https://www.youtube.com/">
<imgsrc="ad.jpg"/>
</a>
</body>
</html>
d) Write a JavaScript function to check whether a given address is 4M
a valid IP address or not.
Ans. Note: Any other relevant logic shall be considered
function isValidIPAddress(address) { Correct logic
const ipv4Regex = /^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/; 2M
const match = address.match(ipv4Regex);
Correct syntax
if (match) { 2M
for (let i = 1; i<= 4; i++) {
const part = parseInt(match[i]);
if (part < 0 || part > 255 || isNaN(part)) {
return false; // Invalid part
}
}
return true;
} else {
return false;
}
}

Page 17 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

e) Explain process to create status bar in JavaScript. 4M

Ans. Status Bar:
The status bar is located at the bottom of the browser window and is Correct
explanation
used to display a short message to visitors on a web page. 4M
Developers who are clever to utilize the status bar employ various
techniques to incorporate the status bar in the design of their web
page. Some developers display a message on the status bar when the
web page first opens. Other developers might change the message to
reflect whatever the visitor is doing on the web page. For example, if
a user is filling registration form then status bar will display a text as
‗User is on form filling section‘.

Building a Static Message:

A static message appears when the web page opens and remains on
the status bar until the web page is closed. The content of the status
bar is the value of the window object's status property.
To display a message on the status bar, assign the message to the
status property of the window object.
Example:-
window.status= 'You are on home page';

<html>
<head>
<script type="text/javascript">
window.status='Welcome to Home Page';
</script>
</head>
<body>
<h1>Hello welcome to JavaScript</h1>
</body>
</html>
5. Attempt any TWO of the following: 12
a) Write HTML script that displays textboxes for accepting 6M
username and password. Write proper JavaScript such that
when the user clicks on submit button

Page 18 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

i) All textboxes must get disabled and change the color to ‘RED;
and with respective labels
ii) Prompt the error message if the password is less than six
characters
Ans. Note: Any other relevant logic shall be considered Create
textboxes
<html> 2M
<head>
<script> Disable
textboxes with
function disableTxt() red color
{ 2M
document.getElementById("un").disabled = true;
Password
document.getElementById('un').style.color = "red"; validation
2M
document.getElementById('aaa').style.color = "red";
document.getElementById("pass").disabled = true;
document.getElementById('pass').style.color = "red";
document.getElementById('bbb').style.color = "red";
}
function validateform(){
var username=document.myform.username.value;
var password=document.myform.password.value;
if (username==null || username==""){
alert("Name can't be blank");
return false;
}else if(password.length<6){
alert("Password must be at least 6 characters long.");
return false;
}
}
</script>
</head>
<body>
<form name="myform" method="post" action="" onsubmit="return
validateform()" >
<label id = "aaa">Username:</label>

Page 19 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

<input type="text" id="un" name="username"/>

<label id = "bbb">
Password:
</label>
<input type="password" id="pass" name="password"/>
<br>
<br>
<button onclick="disableTxt()">Disable Text field</button>
</form>
</body>
</html>
b) Write a webpage that displays a form that contains an input for 6M
students rollno and names user is prompted to enter the input
student rollno and name and rollno becomes value of the cookie.
Ans. Note: Any other relevant logic shall be considered
<html>
<head><script> Create input
function writeCookie() text boxes for
username and
{
password
var d=new Date(); 2M
d.setTime(d.getTime()+(1000*60*60*24));
Set cookie
with(document.myform) 2M
{
document.cookie="Roll No=" + student.value + ";expires=" display 2M

+d.toGMTString();
}}
function readCookie()
{
if(document.cookie=="")
document.write("cookies not found");
else
document.write(document.cookie);
}
</script>
</head>

Page 20 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

<body>
<form name="myform" action="">
Enter your name:
<input type="text" name="student"><br>
Enter your Roll No:
<input type="roll no" name="student"><br>
<input type="Reset" value="Set C" type="button"
onclick="writeCookie()">
<input type="Reset" value="Get C" type="button"
onclick="readCookie()">
</form></body>
</html>
c) Write a JavaScript to create rollover effect that involves text and 6M
images. When the user places his or her mouse pointer over a
book title, the corresponding book images appears
Ans. Note: Any other relevant logic shall be considered Correct logic
3M
<html>
<head>
<title> Correct syntax
3M
rollovers</title>
</head>
<body>
<table border="1" width="100%">
<tbody>
<tr valign="top">
<td width="50%">
<a><img height="500" src="motivation.png" width="900"
name="clr"></a></td>
<td><a onmouseover="document.clr.src='blue.png' ">
<b><u>Motivational book</u></b></a>
<br>
<a onmouseover="document.clr.src=education.png' ">
<b><u>Educational book</u></b></a>
<br>
</td>

Page 21 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

</tr>
</tbody>
</table>
</body>
</html>
6. Attempt any TWO of the following: 12
a) Explain following form control / elements with example Button, 6M
Text, TextArea, Select, Checkbox, Form.
Ans. Note: Combined example including all controls / elements shall be Explanation
considered. of each
control with
Button is created by using following code: example 1M
<form method = ―GET‖ action = ―‖><input type = ―button‖ name =
―MyButton‖ value = ―Click‖ onclick = ―msg()‖><form>
There are several types of button, which are specified by the type
attribute:
1. Button which corresponds to the graphic component.
2. Submit, which is associated to the form and which starts the
loading of the file assigned to the action attribute.
3. Image button in which an image loaded from a file.
A Button object also represents an HTML <button> element which
is specified as follows:
<button name = ―btn‖ value = ―MyButton‖ onclick = ―msg()‖>
Example:
<html>
<body>
<h2>Show a Push Button</h2>
<p>The button below activates a JavaScript when it is clicked. </p>
<form>
<input type="button" value="Click me" onclick="msg()">
</form>
<script>
function msg()
{
alert("Hello world!");
}
</script>

Page 22 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

</body>
</html>

Text:
Input ―text‖ is an object to enter a single line of text whose content
will be part of form data.
In html a text is created by following code:
<input type=‖text‖ name=‖textname‖ id=‖textid‖ value=‖
assign_value‖ />
Example:
<script type="text/javascript">
function changeText()
{
var userInput = document.getElementById('userInput').value;
document.getElementById('vp').innerHTML = userInput;
}
</script>
<input type='text' id='userInput' value='Enter Text Here' />
<p>Welcome <b id='vp'>JavaScript</b></p>
<input type='button' onclick='changeText()' value='Change Text'/>
</script>

TextArea:
The Textarea object represents an HTML <textarea> element.
The <textarea> tag indicates a form field where the user can enter a
large amount of text.
You can access a <textarea> element by using getElementById()

Example:
<html>
<body>
<textarea cols="30" rows="5" wrap="hard" readonly="yes"
disabled="yes">
As you can see many times word wrapping is often the desired look
for your textareas. Since it makes everything nice and easy to read
and preserves line breaks.

Page 23 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

</textarea>
</body>
</html>

Checkbox:
<input> elements of type checkbox are rendered by default as boxes
that are checked (ticked) when activated. A checkbox allows you to
select single values for submission in a form (or not).
Syntax for creating checkbox is:
<input type="checkbox" id="myCheck" onclick="myFunction()">
A checkbox can have only two states:
1. Checked
2. Unchecked

Example:
<html>
<body>
<div>
<br>
<input type="checkbox" name="program" id="it" value="IT">
<label for="it">Information Tech</label><br>
<input type="checkbox" name="program" id="co" value="CO"
checked>
<label for="co">Computer Engg</label><br>
<input type="checkbox" name="program" id="ej" value="EJ">
<label for="ej">Electronics</label><br>
<button onclick="validate();">Validate</button>
</div>
<div id="status">
</div>
<script>
function validate()
{
var elements = document.getElementsByName("program");
var statusText = " ";

Page 24 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

for (var index=0;index <elements.length;index++)

{
statusText = statusText +
elements[index].value+"="+elements[index].checked+"<br>";
}
document.getElementById("status").innerHTML = statusText;
}
</script>
</body>
</html>

Select:
Form SELECT elements (<select>) within your form can be
accessed and manipulated in JavaScript via the corresponding Select
object.
To access a SELECT element in JavaScript, use the syntax:
document.myform.selectname //where myform and selectname are
names of your form/element.
document.myform.elements[i] //where i is the position of the select
element within form
document.getElementById("selectid") //where "selectid" is the ID of
the SELECT element on the page.
Example:
<html>
<body>
<select id="programs" size="5">
<option>Computer Engineering</option>
<option>Information Technology</option>
<option>Chemical Engineering</option>
<option>Electronics &TeleComm.</option>
</select>
<p>Click the button to disable the third option (index 2) in the
dropdown list.</p>
<button onclick="myFunction()">Disable Option</button>
<script>

Page 25 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

function myFunction()
{
var x = document.getElementById("programs").options[2].disabled
= true;
document.getElementById("programs").options[2].style.color =
"red";
}
</script>
</body>
</html>

Form:
A form is a section of an HTML document that contains elements
such as radio buttons, text boxes and option lists. HTML form
elements are also known as controls.
Elements are used as an efficient way for a user to enter information
into a form. Typical form control objects also called ―widgets‖
includes the following:
 Text box for entering a line of text.
 Push button for selecting an action.
 Radio buttons for making one selection among a group of
options.
 Check boxes for selecting or deselecting a single, independent
option.
The <form> element can contain one or more of the following form
elements:
· <input> · <textarea> · <button> · <select> · <option> · <fieldset> ·
<label>
· <legend>
Syntax:
<form name = ―myform‖ id = ―myform‖ action = ―page.html‖
onSubmit = ―test()‖> -----objects---- </form>

b) Write a JavaScript for protecting web page by implementing the 6M

following steps:
i) Hiding your source code

Page 26 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

ii) Disabling the right MouseButton

iii) Hiding JavaScript
Ans. i) Hiding your source code:
Hiding source
 Every developer has to admit that, on occasion, they've peeked at code 2M
the code of a web page or two by right-clicking and choosing
View Source from the context menu. Disabling
 In fact, this technique is a very common way for developers to Mouse button
learn new techniques for writing HTML and Javascript. 2M
However, some developers don't appreciate a colleague snooping
around their code and then borrowing their work without Hiding
permission. This is particularly true about javascript, which are JavaScript
typically more time-consuming to develop than using HTML to 2M
build a web page.
 In reality, you cannot hide your HTML code and JavaScript from
prying eyes, because a clever developer can easily write a
program that pretends to be a browser and calls your web page
from your web server, saving the web page to disk, where it can
then be opened using an editor. Furthermore, the source code for
your web page—including your JavaScript—is stored in the
cache, the part of computer memory where the browser stores
web pages that were requested by the visitor.
 A sophisticated visitor can access the cache and thereby gain
access to the web page source code.
 However, you can place obstacles in the way of a potential
peeker. First, you can disable use of the right mouse button on
your site so the visitor can't access the View Source menu option
on the context menu. This hide both your HTML code and your
JavaScript from the visitor. Nevertheless, the visitor can still use
the View menu's Source option to display your source code. In
addition, you can store your JavaScript on your web server
instead of building it into your web page. The browser calls the
JavaScript from the web server when it is needed by your web
page.
 Using this method, the JavaScript isn't visible to the visitor, even
if the visitor views the source code for the web page.

ii) Disabling the right Mouse Button:

The following example shows how to disable the visitor's right
mouse button while the browser displays your web page. All the

Page 27 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

action occurs in the JavaScript that is defined in the <head> tag of

the web page.
Example:
<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.

iii) Hiding JavaScript:

You can hide your JavaScript from a visitor by storing it in an
external file on your web server. The 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.

The next example shows how to create and use an external

JavaScript file. First you must tell the browser that the content of the
JavaScript is located in an external file on the web server rather than
built into the web page. You do this by assigning the file name that
contains the JavaScript to the src attribute of the <script> tag.

Page 28 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

Next, you need to define empty functions for each function that you
define in the external JavaScript file.

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);
}
c) Develop a JavaScript to create rotating Banner Ads with URL 6M
links.
Ans. Note: Any other correct logic / program shall be considered
<html>
<head>
Correct
<title>Link Banner Ads</title> program 6M
<script language="Javascript" type="text/javascript">
Banners = new Array('1.jpg','2.jpg')
BannerLink = new Array('google.com/', 'msbte.org.in/');
CurrentBanner = 0;
NumOfBanners = Banners.length;
function LinkBanner()
{
document.location.href ="http://www." +

Page 29 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2005 Certified)

SUMMER – 2024 EXAMINATION

MODEL ANSWER
Subject: Client Side Scripting Language Subject Code: 22519

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>
<a href="javascript: LinkBanner()"><imgsrc="1.jpg"
width="400" height="75" name="RotateBanner" /></a>
</center>
</body></html>

Page 30 / 30
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
WINTER – 2023 EXAMINATION
Model Answer – Only for the Use of RAC Assessors

Subject Name: Client Side Scripting Subject Code:

22519
Important Instructions to examiners:
1) The answers should be examined by key words and not as word-to-word as given in the model answer22519
scheme.
2) The model answer and the answer written by candidate may vary but the examiner may try to assess the
understanding level of the candidate.
XXXXX
3) The language errors such as grammatical, spelling errors should not be given more Importance (Not applicable for
subject English and Communication Skills.
4) While assessing figures, examiner may give credit for principal components indicated in the figure. The figures
drawn by candidate and model answer may vary. The examiner may give credit for any equivalent figure drawn.
5) Credits may be given step wise for numerical problems. In some cases, the assumed constant values may vary and
there may be some difference in the candidate’s answers and model answer.
6) In case of some questions credit may be given by judgement on part of examiner of relevant answer based on
candidate’s understanding.
7) For programming language papers, credit may be given to any other program based on equivalent concept.
8) As per the policy decision of Maharashtra State Government, teaching in English/Marathi and Bilingual (English +
Marathi) medium is introduced at first year of AICTE diploma Programme from academic year 2021-2022. Hence if
the students in first year (first and second semesters) write answers in Marathi or bilingual language (English
+Marathi), the Examiner shall consider the same and assess the answer based on matching of concepts with model
answer.
9) For programming language papers, in answer session comments and output is not required.
Q. Sub Answer Marking
No. Q. Scheme
N.

1 Attempt any FIVE of the following: 10 M

a) State meaning of each token of the following statement and describe 2M

it:
i) ++a;
ii) document. bgcolor;

Ans (i) ++ is the increment operator and a is the operand, hence a++ will increment the Anyone
value of a by 1. explained - 1
M each.
(ii) The bgColor property specifies the background color of HTML document.
b) Write and explain syntax of prompt( ) method in JavaScript. 2M

Ans  prompt() method is used to display a dialogue box to the user to prompt them to Definition- 1
an input. M

 It has two buttons “OK” and “CANCEL”, if the user click on the “OK” button Syntax- 1 M
then it will return the inputed value , if the user clicks on the "CANCEL” button
then it will return a null value

 Syntax: prompt(text)

Page No: 1 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
 Example:
<script>
var name = prompt ("Enter a name");
document. Write(name);
</script>
c) List various assignment operators supported by JavaScript, explain any 2M
two with the help of suitable example.
Ans assignment operators supported by JavaScript List – 1 M
Operators Meaning Explain any 2
= Equal to -1M
+= Plus Equal to
-= Minus Equal to
/= Divide Equal to
%= Modulus Equal to
*= Multiply Equal to

Example:
<script>
// = is used to assign a value to a variable
var num = 10;
document.write(num); // num 10
/* += first add the value to the existing value of the variable then assign it the new added
value */
num +=10; document.write(num); // num 20
</script>
d) Differentiate between shift() and push() methods of an Array object. 2M

Ans Any two

points- 1 M
shift push each
1. shift method is used to delete the first 1. push method is used to insert zero or
element of an existing array more element at the end of an existing
array
2. Syntax: 2. Syntax:
arr.shift(); arr.push(element1,element2,…,elementn);
3. Example: 3. Example:
<script> <script>
var arr = [1,2,3,4]; var arr = [1,2,3,4];
document.write(arr); document.write(arr);
arr.shift(); arr.push(5,6);
document.write(arr); document.write(arr);
</script> </script>

Page No: 2 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
e) State the meaning of "Defining a function". Explain with the help of an example. 2M

Ans  A function is a block of code that takes some input to perform some certain Explanation-
computation. 1M

 The main purpose of the function is to put commonly used or repeatedly used Example- 1
task in a function, so instead of writing the code again and again we can call it M
instead.

 The function can be defined as followed:

Syntax:
function func_name(parameter1 ,parameter2,…,parametern)
{
//code
}
Example:
<script>
function add(num1,num2)
{
return num1 + num2;
}
add(1,2);
</script>
f) Give syntax of and explain the use of small “with” clause. 2M

Ans “with” clause is used to directly access the properties and method of an object. Explanation-
1M
Syntax:
with (object) Syntax- 1 M
{
//object
}
Example:
<script>
var person ={ name:"Abc", age:18
}
with(person){ docment.write(name); docment.write(age);
}
</script>
g) With the help of suitable example explain the Date object and any two methods of 2M
Date object.

Ans “Date” object is used when we want to perform some operation on date, it has various Explanation-
method which helps you performs some task related to date, 1M
Example: Example- 1

Page No: 3 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
<script> M
var date = new Date();
document.write(date.getDate()); // get the current date
document.write(date.getFullYear()); // get the current Year
document.write(date.getMinutes()); // get the current minutes
</script>

2. Attempt any THREE of the following: 12 M

a) Write a JavaScript that accepts a number and displays addition of digits 4M

of that number in a message box.
Ans <html> Relevant
<body> code- 4 M
<script>
var num = prompt(“Enter a 2 digit number:”); //accept number from user
var digits = num.split();
var firstdigit = Integer(digits[0]);
var seconddigit = Integer(digits[1]);
var addition = firstdigit+seconddigit;
alert(“The addition is “+addition); //display result in message box
</script>
</body>
</html>
b) Describe the navigator object in JavaScript. Describe the methods of 4M
navigator object which is used to display browser name and version.
Ans  Navigator object is a representation of user’s browser. Explanation -
 Navigator is an object of window. 2M
 Methods of navigator object- Only one method is supported by Navigator
Object. Method – 2
i) javaEnabled()- returns true if the browser has java enabled. M
• We use appName to display browser name. appName is a property of navigator.
• appName property returns browser name.
• We use appVersion to display browser version. appVersion is a property of
navigator.
• appVersion property returns browser version.
• Example:-
<html>
<body>
<script>
document.write(“Browser name: “+navigator.appName); document.write(“Browser
Version: “+navigator.appVersion);
</script>

Page No: 4 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
</body>
</html>
c) Give syntax of and explain for-in loop in javascript with the help of suitable 4M
example.

Ans For-in Loop: Explanation -

2M
Syntax:-
Syntax – 1 M
For(x in object){
Example-1 M
//code to be executed
}

 For-in loop is used to loop through the properties of an object.

 In syntax, variable represents the property name, and object is the object being
iterated.
 It's handy for tasks like accessing or manipulating object properties.
Example:-
<html>
<body>
<script>
Var car = { Brand: ‘Toyota’, Model: ‘Camry’, Year: 2022
};
For( key in car){ Document.write(‘${key}: ${car[key]}’);
}
</script>
</body>
</html>
d) Write an HTML script that accepts Amount, Rate of interest and Period 4M
from user. When user submits the information a JavaScript function must
calculate and display simple interest in a message box. (Use formula S.I. =
PNR/100)

Ans <html> Relevant

code- 4 M
<body>
<script>
var P = parseInt(prompt(“Enter the principal amount:”));
var N = parseInt(prompt(“Enter the period:”));
var R = parseInt(prompt(“Enter the Rate of interest:”));
var SI =(P*N*R)/100;
alert(“Simple Interest is “+SI);

Page No: 5 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
</script>
</body>
</html>

OR
<html>
<head>
<script>

function interest()
{
var P, N, R;
P= parseInt(document.getElementById("pr").value);
N = parseInt(document.getElementById("period").value);
R = parseInt(document.getElementById("ri").value);
var SI =(P*N*R)/100;
alert("Simple Interest is="+SI);
}
</script>
</head>
<body>
<p>Principal Amount:<input id="pr"></p>
<p>Period in Year: <input id="period"></p>
<p>Rate of Interst: <input id="ri"></p>
<button onclick="interest()"> Simple Interest</button>
</body>
</html>

Output:

Page No: 6 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
3. Attempt any THREE of the following: 12 M

a) Write an HTML Script that displays the following webpage output: Designing
and calling
function in
onClick() -
1M

Writing
function for
add,sub,mul-
03M
The user enters two numbers in respective text boxes. Write a JavaScript
such that when user clicks "add", a message box displays sum of two entered
numbers, if the user clicks on "sub”. Message box displays subtraction of two
numbers and on clicking “mul” the message box displays multiplication of
two numbers.

Ans <html>
<head>
<script>
function add()
{
var num1, num2, r;
//to accept 2 values and stored in variable num1 and num2
num1 = parseInt(document.getElementById("firstnumber").value);
num2 = parseInt(document.getElementById("secondnumber").value);
r= num1 + num2;
alert(r);
}
function sub()
{
var num1, num2, r;
num1 = parseInt(document.getElementById("firstnumber").value);
num2 = parseInt(document.getElementById("secondnumber").value);

Page No: 7 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
r = num1 - num2;
alert(r);
}
function mul()
{
var num1, num2, r;
num1 = parseInt(document.getElementById("firstnumber").value);
num2 = parseInt(document.getElementById("secondnumber").value);
r = num1 * num2;
alert(r);
}
</script>
</head>
<body>
<fieldset>
<p>First Number: <input id="firstnumber"></p>
<p>Second Number: <input id="secondnumber"></p>
//onClick() event to perform addition, subtraction and multiplication
<button onclick="add()">Add</button>
<button onclick="sub()">Sub</button>
<button onclick="mul()">Mul</button>
</fieldset>
</body>
</html>

Output:

Page No: 8 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________

b) Write a JavaScript that accents user's first name and domain name of 4M
Organization from user., The JavaScript then forms email address as
<firstname@domain> name and displays the results in the browser window.

Ans <html> Accept

values-1M
<head>
Formation of
<script> email id-2M
//Email Address Function Calling
function in
function myemail()
onClick()-1M
{
var s1 = document.getElementById("first").value;
var s2 = document.getElementById("domain").value;
var s3=s1+"@"+s2;
document.getElementById("email").innerHTML = s3;
}
</script>
</head>
<body>
<p>First Name: <input id="first"></p>
<p>Domain Name: <input id="domain"></p>
<button onclick="myemail()">create email id</button>
<br> Email ID is
<p id="email"> </p>
</body>
</html>

Page No: 9 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
Output:

c) Differentiate between substring() and substr() method of a string class. Give 4M

Suitable example of each.

Ans Parameters substring() substr()

Use It is used to extract the It is used to extract a part of 3 points-3M

specified substring within a the string Example-1M
string

Syntax str.substring(start, end); str.substr(start, len);

Parameters Its parameters are the start It takes parameters as starting

and end position of the index of the part which we
substring that we want to want to extract and the length
extract. till which we want to extract
the string part.

index This method cannot handle This method can handle

negative indexes. negative indexes.

Example:
<script>
var a="Javascript";
document.write("Using substring()="+a.substring(2,6));
document.write("<br>Using substr()="+a.substr(2,6));
</script>

Output:
Using substring()=vasc
Using substr()=vascri
d) State what is a cookie? Explain its need. State characteristics of persistent 4M
cookies.

Page No: 10 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
Ans Cookie: Definition-1M
Cookies are small text files that websites use to store information on a user's computer
or device. Cookies can be used for a variety of purposes, such as remembering a user's Need-1M
preferences, tracking their behavior on a website, and enabling personalized advertising.
Charactristics-
There are two main types of cookies: session cookies and persistent cookies. 2M

Need of Cookie:
Cookies are built specifically for web browsers to track, personalize and save
information about each user's session. A “session” is the word used to define the amount
of time you spend on a site. Cookies are created to identify you when you visit a new
website.

Characteristics of persistent cookies:

 Persistent cookies can be used to store information that needs to be accessed
across multiple browsing sessions, such as login credentials and language
preferences.

 Persistent cookies can be used to track a user's behavior on a website over time,
which can be used to personalize the user's experience.

 Persistent cookies can be used to remember a user's preferences, such as their

preferred layout or font size.

4. Attempt any THREE of the following: 12 M

a) Write a JavaScript that accepts a string and searches for the pattern 4M
"MSBTE" in the given string using regular expressions. If the pattern is
found, JavaScript will display that "Pattern is found" else display "Pattern is
not found".

Ans <html> Accept string-

<head> 1M
<title>JavaScript RegExp exec Method</title>
</head> Correct
<body> RegEx-2M
<script type = "text/javascript">
Condition
var str= prompt("Enter a string");
checking-1M
var re = new RegExp( "MSBTE", "g" );
var result = re.exec(str);
if(result=="MSBTE")
{
document.write("pattern is found");
}
else
{
document.write("pattern is not found");
}
Page No: 11 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
</script>
</body>
</html>
b) List and state various properties of a window object. Write a JavaScript that 4M
opens a new popup window with message WELCOME To SCRIPTING"
when the page loads and a new popup window displaying message "FUN
WITH SCRIPTING when the page unloads.

Ans Window Object Properties properties of a

window
Property Description object-1M

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

Frames It returns an array of all the frames including iframes in the current calling onload
window. ()-1M

Closed It returns the Boolean value indicating whether a window has been
closed or not.
calling
History It returns the history object for the window. onunload()-
1M
innerHeight It sets or returns the inner height of a window's content area.
innerWidth It sets or returns the inner width of a window's content area.
valid function
Length It returns the number of frames in a window.
definition-1M
Location It returns the location object for the window.
Name It sets or returns the name of a window.
Navigator It returns the navigator object for the window.
Opener It returns a reference to the window that created the window.
outerHeight It sets or returns the outer height of a window, including
toolbars/scrollbars.
outerWidth It sets or returns the outer width of a window, including
toolbars/scrollbars.
Parent It returns the parent window of the current window.
Screen It returns the screen object for the window.
screenX It returns the X coordinate of the window relative to the screen.
screenY It returns the Y coordinate of the window relative to the screen.
Self It returns the current window.
Status It sets the text in the status bar of a window.
Top It returns the topmost browser window that contains frames.

Page No: 12 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
Code:
<html>
<body onload="openWin()" onunload = "myWindow.document.write("FUN WITH
SCRIPTING");">

c) Write an HTML script that displays names of different brands of Laptop and 4M

an image by default as :

When the mouse moves over the specific brand name the script must display the
image of respective Laptop in the adjacent box.
Ans Code: Designing of
form-1M
<html>
<head> Any relevant
Page No: 13 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
<title> logic-3M
text rollovers</title>
<script>
b=new Image;
r=new Image;
g=new Image;
if(document.images)
{
b.src='vv.png';
r.src='hp.png';
g.src='dell.png';
}
else
{
b.src='';
r.src='';
g.src='';
document.clr='';
}

</script>
</head>
<body>
<table border="0" width="100%">
<tbody>
<tr valign="top">

<td><H2><ul><li>
<a onmouseover="document.clr.src='vv.png'">
<b><u>Lenovo</u></b></a></li>
<li><a onmouseover="document.clr.src='hp.png'">
<b><u>HP</u></b></a></li>
<li><a onmouseover="document.clr.src='dell.png'">
<b><u>DELL</u></b></a></li></ul>
</H2>
</td>
<td width="50%">
<a><img height="200" src="vv.png" width=400" name="clr"></a></td>
</tr>
</tbody>
</table>
</body>
</html>

Output:
When mouse over to HP, hp laptop image will displayed.

Page No: 14 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________

d) Give syntax of and explain the use of SetTimeOut() function with the help of 4M
suitable example.

Ans
Use of setTimeout() Use of
SetTimeOut()-
The setTimeout() method executes a block of code after the specified time. The method 1M
executes the code only once.
Syntax-1M
The commonly used syntax of JavaScript setTimeout is: Example-2M

setTimeout(function, milliseconds);

Its parameters are:

 function - a function containing a block of code

 milliseconds - the time after which the function is executed

The setTimeout() method returns an intervalID, which is a positive integer.

Example: Display a Text Once After 3 Second

Page No: 15 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
In the above program, the setTimeout() method calls the greet() function after 3000
milliseconds (3 second).
Hence, the program displays the text Hello world only once after 3 seconds.
e) State the use of hiding the JavaScript. Explain the steps needed to accomplish it and 4M
describe the process.

Ans You can hide your JavaScript from a visitor by storing it in an external file on your web Use-2M
server. The 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 Steps with
you look at the source code for the web page, you'll see reference to the external .js file, code-2M
but you won't see the source code for the JavaScript.

5. Attempt any TWO of the following: 12 M

a) Write a JavaScript that demonstrates use of floating menu alongwith 6M

respective HTML script.

Ans Code: Any relevant

<html> logic or
<title>Example</title> example-6M
<style>
body {
background-image: url('/pix/samples/bg1.gif');
}
main {
margin-bottom: 200%;
}
.floating-menu {
Page No: 16 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
font-family: sans-serif;
background: yellowgreen;
padding: 5px;;
width: 130px;
z-index: 100;
position: fixed;
}
.floating-menu a,
.floating-menu h3 {
font-size: 0.9em;
display: block;
margin: 0 0.5em;
color: white;
}
</style>
<main>
<p>Scroll down and watch the menu remain fixed in the same position, as though it
was floating.</p>
<nav class="floating-menu">
<h3>Floating Menu</h3>
<a href="c_sub.txt">C</a>
<a href="C++_sub.txt">C++</a>
<a href="java_sub.txt">Java</a>
<a href="python_sub.txt">Python</a>
</nav>
</main>

Output:

b) Form regular expressions for following : 6M

Page No: 17 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
i) Validation of email address.

ii) Validation of adhaar card. Format is

dddd - dddd - dddd

(iii) Validation of phone number. Format is

(ddd) -(dddddddd)

Ans i) Regular expression for Validation of email address: Any valid

regex for
var validRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0- emailed-2M
9-]+)*$/;
Any valid
regex for
ii) Validation of adhaar card Format is adhaar card-
dddd - dddd – dddd 2M
Any valid
Regular expression for Validation of adhaar card
regex for
/^[2-9]{1}[0-9]{3}\s[0-9]{4}\s[0-9]{4}$/gm
phone no-2M

iii) Validation of phone number. Format is

(ddd) -(dddddddd)

Regular expression for Validation of phone number:

var re = /^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/im;s

Page No: 18 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
c) 6M

Ans Code: Designing of

<html> form-2M
<body>
<html> Any relevant
<script type="text/javascript"> script-4M
function modifyList(x)
{
with(document.forms.myform)
{
if(x ==1)
{
optionList[0].text="Green Tea";
optionList[0].value=1;
optionList[1].text="Milk Tea ";
optionList[1].value=2;
optionList[2].text="Black Tea";
optionList[2].value=3;
}

if(x ==2)
{
optionList[0].text="Capaccino";
optionList[0].value=1;
Page No: 19 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
optionList[1].text="Latte";
optionList[1].value=2;
optionList[2].text="Expression";
optionList[2].value=3;
}
if(x ==3)
{
optionList[0].text="MAAZA";
optionList[0].value=1;
optionList[1].text="SPRITE";
optionList[1].value=2;
optionList[2].text="COKA-COLA";
optionList[2].value=3;
}

}
}

</script>
</head>
<body>
<form name="myform" action=" " method="post">
<table><tr><td>
Select Beverage: </td><td>
<input type="checkbox" name="grp1" value=1 checked="true"
onclick="modifyList(this.value)"> TEA

<input type="checkbox" name="grp1" value=2 onclick="modifyList(this.value)">

COFFEE
<input type="checkbox" name="grp1" value=3 onclick="modifyList(this.value)">
SOFT DRINK

</td></tr></table>
<select name="optionList" size="3">
<option value=1>Kiwi
<option value=1>Pine-Apple
<option value=1>Apple
</tr> </table>
</select>
</form>
</body>
</html>

Output:

Page No: 20 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________

6. Attempt any TWO of the following: 12 M

a) List and explain any six form events. 6M

Ans One event

with
Event Handler Description explanation-
1M each
onfocus When the user focuses on an element
onsubmit When the user submits the form
onblur When the focus is away from a form element (The onblur event
occurs when an object loses focus.)
onchange When the user modifies or changes the value of a form element
keydown The event occurs when the user is pressing a key
keypress The event occurs when the user presses a key
keyup The event occurs when the user releases a key
onclick 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
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
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.

b) Write a JavaScript that sets a crawling status bar message to the webpage. 6M
Message is "Welcome to the Mystic World of JavaScript". The message must
start crawling when the webpage gets loaded.

Ans <html> Any relevant

<head> script-6M
<title>Scrolling Text</title>
<script language="JavaScript">
var scrollPos = 0; // initial position to start status bar
var maxScroll = 100; // maximum allowed position
Page No: 21 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
var blanks = "";
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>
</head>
<body onload="scrollText(‘Welcome to the Mystic World of JavaScript".’, 300)">
<p>Watch the text scroll at the bottom of this window!</p>
</body>
</html>
c) i)Design frameset tag for representing following layout: 6M

ii) List any three properties of regular expression objects and state their use.
Ans i) i) correct html
code-3M
Code:
ii) 3 properties
<html> with use-3M
<head> each
<title>Create a Frame</title>
</head>
<frameset rows="10%,*" border="5" frameborder="1" bordercolor="red" noresize>
<frame src="frame1.html">
<frameset cols="33%,33%,*" border="3">
<frame src="frame2.html">
<frame src="frame4.html">
Page No: 22 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
<frame src="frame3.html">
</frameset>
</frameset>
</html>

ii)

property Property & Description

constructor Specifies the function that creates an object's

prototype.
global
Specifies if the "g" modifier is set.

ignoreCase
Specifies if the "i" modifier is set.

lastIndex
The index at which to start the next match.

multiline
Specifies if the "m" modifier is set.

source
The text of the pattern.

Example:
<html>
<head>
<title>JavaScript RegExp ignoreCase Property</title>
</head>
<body>
<script type = "text/javascript">
var re = new RegExp( "string" );

if ( re.ignoreCase )
{

Page No: 23 | 24
MAHARASHTRA STATE BOARD OF TECHNICAL EDUCATION
(Autonomous)
(ISO/IEC - 27001 - 2013 Certified)
__________________________________________________________________________________________________
document.write("Test1-ignoreCase property is set");
} else
{
document.write("Test1-ignoreCase property is not set");
}

re = new RegExp( "string", "i" );

if ( re.ignoreCase )
{
document.write("<br/>Test2-ignoreCase property is set");
} else
{
document.write("<br/>Test2-ignoreCase property is not set");
}
</script>
</body>
</html>

Page No: 24 | 24
Chapter 1
1. Creating Object
<html>
<body>
<script>
// Method 1: Single object using object literal
var student = {
name : "Ram",
marks : 99
};

// Method 2: Using new key word, using instance of Object

var emp = new Object();
emp.name = "Sham";
emp.salary = 100000;

// Method 3: Using object constructor

function car(brand,color){
this.brand = brand;
this.color = color;
}
c = new car("Audi","Black");
</script>
</body>
</html>

2. Display the current date and time

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
1
<html>
<body>
<script>
var d = new Date();
var y = d.getFullYear();
var m = d.getMonth() + 1;
var dd = d.getDay() + 1;
var h = d.getHours() + 1;
var m = d.getMinutes() + 1;
var s = d.getSeconds() + 1;

document.write("Current date : " + dd + "/" + m + "/" + y);

document.write("<br>Current time : " + h + ":" + m + ":" + s);
</script>
</body>
</html>

Output :

3. String Methods
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
2
<html>
<body>
<script>
var str = "A JavaScript";
document.write("Char At: " + str.charAt(4)+"<br>");
document.write("Char Code At: " + str.charCodeAt(0)+"<br>");
document.write("Index of: " + str.indexOf("p")+"<br>");
document.write("Lower Case: " + str.toLowerCase()+"<br>");
document.write("Upper Case: " + str.toUpperCase()+"<br>");
</script>
</body>
</html>

Output :

4. Simple calculator

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
3
<html>
<body>
<script>
var num1 = parseInt(prompt("Enter number 1 : "));
var num2 = parseInt(prompt("Enter number 2 : "));
var option = prompt("Enter operation to perform (ex. +,-,*,/) : ");

switch(option){
case "+" : alert(num1 + num2);
break;
case "-" : alert(num1 - num2);
break;
case "/" : alert(num1 / num2);
break;
case "*" : alert(num1 * num2);
break;
}
</script>
</body>
</html>

Output :
// alert box according to enter fields //

5. Getters and setters :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
4
<html>
<body>
<script>
var car = {
Defbrand : "Audi",
//getter
get brand(){
return this.Defbrand;
},
// setters
set brand(value){
this.Defbrand = value;
},
};
//Getter
document.write("Brand : " + car.Defbrand);
//setter
car.brand = "Maruti";
document.write("<br>Brand : " + car.Defbrand);
</script>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
5
Chapter 2
1. Sorting and reversing array

<html>
<body>
<script>
var arr = new Array("Ram","Sham","Om");
document.write("Sorted array : " + arr.sort());
document.write("<br>Reversing array : " + arr.reverse());
</script>
</body>
</html>

Output :

2. Adding and removing elements from array

<html>
<body>
<script>
var arr = new Array("a1","a2","a3");
arr.push("a4");
document.write("Push : " + arr);
arr.pop();
document.write("<br>Pop : " + arr);

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
6
arr.unshift("a0");
document.write("<br>Unshift : " + arr);
arr.shift();
document.write("<br>Shift : " + arr);
</script>
</body>
</html>

Output :

3. Calling function from HTML

<html>
<head>
<script>
function welcome(){
alert("welcome");
}
function bye(){
alert("bye");
}
</script>
</head>
<body onload="welcome()" onunload="bye()">
</body>
</html>
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
7
Chapter 3
1. Display input contents

<html>
<head>
<script>
function show(){
var name = document.getElementById("demo").value;
alert("Name : " + name);
}
</script>
</head>
<body>
Enter name : <input type="text" id="demo"><br>
<button onclick="show()">show</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
8
2. Changing style of contents/ elements
(Changing color of text of <p> tag and its background )

<html>
<head>
<script>
function change(){
var x = document.getElementsByTagName("p");
var i;
for(i=0;i<x.length;i++){
x[i].style.color = "red";
x[i].style.backgroundColor = "Pink";
}
}
</script>
</head>
<body>
<p>V2V</p>
<p>Best for diploma</p>
<button onclick="change()">Change</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
9
3. Changing inner text

<html>
<head>
<script>
function load(){
document.getElementById("demo").innerHTML = "This text is added dynamically";
}
</script>
</head>
<body onload="load()">
<p id="demo"></p>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
10
4. All elements of in form

<html>
<body>
<form>
Enter your name : <input type="text"><br><br>
Select gender :
<input type="radio" name="grp1" checked="true"> Male
<input type="radio" name="grp1"> Female
<br><br>

Select colors :
<input type="checkbox" name="grp2" checked="true"> Red
<input type="checkbox" name="grp2"> White
<input type="checkbox" name="grp2"> Black
<input type="checkbox" name="grp2"> Yellow
<br><br>

Enter address : <br>

Select City :
<select>
<option value="1">Badlapur</option>
<option value="2">Kalyan</option>
<option value="3">Thane</option>
</select>
<br><br>

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

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
11
</form>
</body>
</html>

Output :

5. Mouse events

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
12
6. Key events

<html>
<body>
Enter name : <input type="text" onkeydown="javascript:alert('Key down')"
onkeyup="javascript:alert('Key up')">
</body>
</html>

Output :

7. Changing option list dynamically

<html>
<head>
<script>
function Change(EventCode){
with(document.forms.myform){
if(EventCode == 1){
OptionList[0].value = 1;
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
13
OptionList[0].text = "Apple";
OptionList[1].value = 2;
OptionList[1].text = "Banana";
OptionList[2].value = 3;
OptionList[2].text = "Kiwi";
}

if(EventCode == 2){
OptionList[0].value = 1;
OptionList[0].text = "Lotus";
OptionList[1].value = 2;
OptionList[1].text = "Rose";
OptionList[2].value = 3;
OptionList[2].text = "Mogra";
}
}
}
</script>
</head>
<body>
<form name="myform">
<select name="OptionList" size="2">
<option value="1">Apple</option>
<option value="2">Banana</option>
<option value="3">Kiwi</option>
</select>
<br><br>

<input type="radio" value="1" name="grp1" onclick="Change(this.value)"> Fruits

<input type="radio" value="2" name="grp1" onclick="Change(this.value)"> Flowers
<br>
<input type="reset">

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
14
</form>
</body>
</html>

Output :

8. Enable and disable text field

<html>
<head>
<script>
function change(){
var x = document.getElementById("demo");
x.disabled = false;
}

function noChange(){
var x = document.getElementById("demo");
x.disabled = true;
}
</script>
</head>
<body>
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
15
Enter name : <input type="text" id="demo">
<br><br>
<button onclick="change()">Enable</button>
<button onclick="noChange()">Disable</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
16
Chapter 4

1. Set, Get, Delete, and Display Cookies

<html>
<head>
<title>Cookie Manager</title>
<script>
function setCookie() {
document.cookie = "myCookie=myValue;path=/";
}

function getCookie() {
var x = document.cookie;
alert(x);
}

function deleteCookie() {
// Also for setting expiration date
document.cookie = "myCookie=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/";
}

function displayCookies() {
alert("All Cookies: " + document.cookie);
}
</script>
</head>
<body>
<button onclick="setCookie()">Set Cookie</button>
<button onclick="getCookie()">Get Cookie</button>
<button onclick="deleteCookie()">Delete Cookie</button>
<button onclick="displayCookies()">Display Cookies</button>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
17
</body>
</html>

Output :

2. Display value and changing color of textbox

<html>
<head>
<script>
function change(){
var x = document.getElementById("name");
x.style.backgroundColor = "red";
alert(x.value);
}
</script>
</head>
<body>
<input type="text" id="name">
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
18
<br><br>
<button onclick="change()">Click</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
19
3. Opening and Closing window

<html>
<head>
<title>Open and Close Window</title>
<script>
var newWindow;
function openWin() {
newWindow = window.open("", "", "width=200,height=100,left=100,top=200");
}
function closeWin() {
newWindow.close();
}
</script>
</head>
<body>
<button onclick="openWin()">Open Window</button>
<button onclick="closeWin()">Close Window</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
20
4. scrollBy() scrollTo() moveBy() moveTo()

<html>
<head>
<title>Window Operations Example</title>
<script>
var newWindow;

function openNewWindow() {
newWindow = window.open("", "", "width=200,height=200");
newWindow.document.write("<div style='height: 1500px;'>Scroll and move this window</div>");
}

function scrollNewWindow() {
newWindow.scrollBy(0, 100);
}

function scrollToNewWindow() {
newWindow.scrollTo(0, 600);
}

function moveNewWindow() {
newWindow.moveBy(150, 150);
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
21
}

function moveToNewWindow() {
newWindow.moveTo(300, 200);
}
</script>
</head>
<body onload="openNewWindow()">
<button onclick="scrollNewWindow()">Scroll By 100px</button>
<button onclick="scrollToNewWindow()">Scroll To 600px</button>
<button onclick="moveNewWindow()">Move By 150px</button>
<button onclick="moveToNewWindow()">Move To (300, 200)</button>
</body>
</html>

Output :

5. Opening multiple windows

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
22
<html>
<head>
<title>Window</title>
<script>
function show() {
for (let i = 0; i < 250; i += 50) {
window.open('', '', 'top=' + (i + 50) + ',width=300,height=200');
}
}
</script>
</head>
<body>
<button onclick="show()">Show Multiple Windows</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
23
6. setTimeout() clearTimeout() setInterval() clearInterval()

<html>
<head>
<script>
function message(){
alert("V2V");
}
var msg;
function fun1(){
msg = setTimeout(message,1000);
}
function fun2(){
clearTimeout(msg);

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
24
}
function fun3(){
msg = setInterval(message,2000);
}
function fun4(){
clearInterval(msg);
}
</script>
</head>
<body>
<button onclick="fun1()">setTimeout</button>
<button onclick="fun2()">clearTimeout</button>
<button onclick="fun3()">setInterval</button>
<button onclick="fun4()">clearInterval</button>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
25
Chapter 5
1. Modifiers

<html>
<head>
<title>Regex Modifiers Example</title>
</head>
<body>
<script>
var text = "Hello World\nhello world\nHELLO WORLD";

document.write("Case-insensitive : " + text.match(/hello/i) + "<br>");

document.write("Global : " + text.match(/hello/g) + "<br>");

document.write("Multiline : " + text.match(/hello/m) + "<br>");

</script>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
26
2. Quantifiers’

<html>
<head>
<title>Quantifiers</title>
</head>
<body>
<script>
var str = "100 1000 or 10000";
document.write("+ (one or more) = " + (/1+/).test(str));

document.write("<br>* (zero more more) = " + (/2*/).test(str));

document.write("<br>? (only zero or one) = " + (/1?/).test(str));

document.write("<br>{N} (only N times in sequence) = " + (/0{8}/).test(str));

document.write("<br>{2,3} (only 2 or 3 times in sequence) = " + (/0{2,3}/).test(str));

document.write("<br>{2,} (2 or more times in sequence) = " + (/1{2,}/).test(str));

document.write("<br>$ (at end) = " + (/0$/).test(str));

document.write("<br>^ (at beginning) = " + (/^0/).test(str));

</script>
</body>
</html>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
27
Output :

3. Matching digits and words

<html>
<head>
<title>Matching</title>
</head>
<body>
<script>
var digit = "123";
var p = ",'|{}";
var word = "hello";

//digit
document.write("\d : " + (/\d/).test(digit));
document.write("<br>\D : " + (/\D/).test(digit));

//Word
document.write("<br>\w : " + (/\w/).test(word));
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
28
document.write("<br>\W : " + (/\W/).test(word));
</script>
</body>
</html>

Output :

4. Match and Replace

<html>
<head>
<title>match and replace</title>
</head>
<body>
<script>
var str = "he is good man";
document.write("Match : " + str.match(/is/));
document.write("<br>Replace : " + str.replace(/good/g,"bad"));
</script>
</body>
</html>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
29
Output :

5. Calling function of child window

frame1.html
<html>
<body>
<button onclick="parent.frame2.show()">Show</button>
</body>
</html>

Frame2.html
<html>
<body>
frame 2
<script>
function show(){
alert("hii");
}
</script>
</body>
</html>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
30
Frame.html
<html>
<frameset rows="50%,50%">
<frame src="frame1.html">
<frame src="frame2.html" name="frame2">
</frameset>
</html>

Output :

6. changing content of child window

frame1.html
<html>
<body>
<button onclick="parent.frame2.show()">Show</button>
</body>
</html>

Frame2.html
<html>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
31
<body>
frame 2
<script>
function show(){
parent.frame2.location.href = "frame3.html";
}
</script>
</body>
</html>

frame3.html
<html>
<body>
<h1>Frame 3</h1>
</body>
</html>

Frame.html
<html>
<frameset rows="50%,50%">
<frame src="frame1.html">
<frame src="frame2.html" name="frame2">
</frameset>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
32
7. Writing in the child window
<html>
<head>
<script>
window.onload = function(){
window.frame2.document.write("<h1>hii</h1>");
}
</script>
</head>
<frameset rows="50%,50%">
<frame src="frame1.html"/>
<frame src="" name="frame2"/>
</frameset>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
33
8. Accessing an element of child window

frame1.html
<html>
<body>
<form name="myForm">
<input type="text" name="text">
</form>
</body>
</html>

frame2.html
<html>
<body>
<script>
function change(){
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
34
parent.frame1.myForm.text.value = "V2V";
}
</script>
<button onclick="change()">Change</button>
</body>
</html>

Frame.html
<html>
<frameset rows="50%,50%">
<frame src="frame1.html" name="frame1"/>
<frame src="frame2.html"/>
</frameset>
</html>

Output:

9. Using iframe
<html>
<body>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
35
<iframe width="400" height="250" src="https://www.youtube.com/embed/VubDK5nQpeY?si=BQcF9-
RzEmU1Xas8"></iframe>
</body>
</html>

Output :

10. Rollover
<html>
<body>
<img src="1.jpeg" height="200" width="300" name="img1">
<br><br>
<a onmouseover="javascrip:img1.src='1.jpeg'">car 1</a>
<a onmouseover="javascrip:img1.src='2.jpeg'">car 2</a>
<a onmouseover="javascrip:img1.src='3.jpeg'">car 3</a>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
36
11. Regular expression methods

<html>
<head>
<title>regular expression methods</title>
</head>
<body>
<script>
var str = "V2V is best";
var reg = /V2V/;
document.write(reg.exec(str));
document.write("<br>" + reg.test(str));
document.write("<br>" + reg.toString());
document.write("<br>" + reg.toSource());
</script>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
37
12. Regular expression

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Validation Example</title>
</head>
<body>
<h2>Validation Form</h2>
<form id="validationForm">
Email:<input type="text" id="email"><br><br>
Name:<input type="text" id="name"><br><br>
Aadhaar Number:<input type="text" id="aadhaar"><br><br>
IP Address:<input type="text" id="ip"><br><br>
Phone Number:<input type="text" id="phone"><br><br>
Pincode:<input type="text" id="pincode"><br><br>
<button type="button" onclick="validateForm()">Validate</button>
</form>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
38
<script>
function validateForm() {
var email = document.getElementById("email").value;
var name = document.getElementById("name").value;
var aadhaar = document.getElementById("aadhaar").value;
var ip = document.getElementById("ip").value;
var phone = document.getElementById("phone").value;
var pincode = document.getElementById("pincode").value;

var emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

var namePattern = /^[A-Za-z\s]+$/;
var aadhaarPattern = /^\d{12}$/;
var ipPattern = /^(\d{1,3}\.){3}\d{1,3}$/;
var phonePattern = /^\d{10}$/;
var pincodePattern = /^\d{6}$/;

if (!emailPattern.test(email)) {
alert("Invalid email ID");
} else if (!namePattern.test(name)) {
alert("Invalid name");
} else if (!aadhaarPattern.test(aadhaar)) {
alert("Invalid Aadhaar number");
} else if (!ipPattern.test(ip)) {
alert("Invalid IP address");
} else if (!phonePattern.test(phone)) {
alert("Invalid phone number");
} else if (!pincodePattern.test(pincode)) {
alert("Invalid pincode");
} else {
alert("All inputs are valid");
}
}

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
39
</script>
</body>
</html>

Output :

13. Text rollover

<html>
<head>
<title>Text rollover</title>
<script>
function show1(){
document.getElementById("text").value = "Mouse in";
}
function show2(){
document.getElementById("text").value = "Mouse out";
}
</script>
</head>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
40
<body>
<textarea id="text" onmouseover="show1()" onmouseout="show2()"></textarea>
</body>
</html>

Output :

Chapter 6
1. Window status
<html>
<head>
<title>Status bar</title>
<script>
function showStatus(){
var win = window.open("","myWindow",'height=100,width=100');
win.status = "V2V";
}
</script>
</head>
<body onload="showStatus()">
</body>
</html>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
41
2. Simple banner

<html>
<head>
<title>Banner</title>
<script>
var banners = new Array("c.png","python.png","java.png");
var count = 0;
function rotate(){
count ++;
if(count == banners.length){
count = 0;
}
document.img1.src = banners[count];
setTimeout(rotate,1000);
}
</script>
</head>
<body onload="rotate()">
<img src="c.png" name="img1" height="200" width="200">
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
42
3. Linking Banner

<html>
<head>
<title>Link Banner Ads</title>
<script language="Javascript" type="text/javascript">
Banners = new Array('c.png','python.png','java.png')
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

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
43
}
document.RotateBanner.src= Banners[CurrentBanner];
setTimeout("DisplayBanners()",1000)
}
}
</script>
</head>
<body onload="DisplayBanners()" >
<center>
<a href="javascript: LinkBanner()">
<img src="c.png" width="300" height="300" name="RotateBanner" />
</a>
</center>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
44
4. Slideshow

<html>
<head>
<title>Slide show</title>
<script>
var pics = new Array("c.png","python.png","java.png");
counter = 0;

function SlideShow(status){
if(document.images){
counter = counter + status;
if(counter < 0){
counter = pics.length - 1;
}
if(counter > (pics.length - 1)){
counter = 0;
}

document.img1.src = pics[counter];
}
}
</script>
</head>
<body>
<img src="c.png" height="300" width="300" name="img1">
<br>
<input type="button" value="Next" onclick="SlideShow(1)">
<input type="button" value="Back" onclick="SlideShow(-1)">
</body>
</html>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
45
Output :

5. Changing Background Color

<html>
<head>
<title>Background Change</title>
<script>
function change(){
var color = document.getElementById("color").value;
document.body.style.backgroundColor = color;
}
</script>
</head>
<body>
<select id="color" onchange="change()">

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
46
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="green">Green</option>
</select>
</body>
</html>

Output :

6. Floating Menu

<html>
<head>
<title>Floating menu</title>
<style>
.menu{
background-color: yellowgreen;
width: 200px;
padding: 10px;
color: white;
position: fixed;
}

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
47
.menu a{
display: block;
}
</style>
</head>
<body>
<nav class="menu">
<h3>Floating Menu</h3>
<a href="C.txt">C</a>
<a href="java.txt">java</a>
<a href="python.txt">Python</a>
</nav>
</body>
</html>

Output :

7. Chain select menu

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
48
<title>Chain selection</title>
<script>
var IFemp = new Array("Ram","Sham");
var COemp = new Array("jon","doe");
function getEMP(branch){
var i;
//Remove all elements
for(i = document.myForm.emp.options.length - 1; i>0;i--){
document.myForm.emp.options.remove(i);
}

var dept = branch.options[branch.selectedIndex].value;

if(dept != ""){
if(dept == "1"){
for(i=1;i<=IFemp.length;i++){
document.myForm.emp.options[i] = new Option(IFemp[i-1]);
}
}
if(dept == "2"){
for(i=1;i<=COemp.length;i++){
document.myForm.emp.options[i] = new Option(COemp[i-1]);
}
}
}
}
</script>
</head>
<body>
<form name="myForm">

<select name="dept" onchange="getEMP(this)">

<option value="0">Department</option>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
49
<option value="1">IF</option>
<option value="2">CO</option>
</select>

<select name="emp">
<option value="0">Employee</option>
</select>
</form>
</body>
</html>

Output :

8. Tab Menu

<html>
<head>
<title>Tab Menu</title>
<style>
.cityClass{
display: none;
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
50
}
</style>
<script>
function openCity(city){
var i;
var x = document.getElementsByClassName("cityClass");
for(i=0;i<x.length;i++){
x[i].style.display = "none";
}
var y = document.getElementById(city);
y.style.display = "block";
}
</script>
</head>
<body>
<div>
<button onclick="openCity(this.value)" value="kalyan">Kalyan</button>
<button onclick="openCity(this.value)" value="thane">Thane</button>
<button onclick="openCity(this.value)" value="csmt">CSMT</button>
</div>
<div>
<div id="kalyan" class="cityClass">
<p>This is kalyan page</p>
</div>

<div id="thane" class="cityClass">

<p>This is thane page</p>
</div>

<div id="csmt" class="cityClass">

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
51
</div>
</body>
</html>

Output :

9. Popup Menu

<html>
<head>
<title>Popup menu</title>
<style>
a{
display: block;
}
.branch{
display: none;
}
.program:hover .branch{
display: block;
}
</style>
</head>
<body>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
52
<div class="program">
Program
<div class="branch">
<a href="#">IF</a>
<a href="#">CO</a>
<a href="#">AIML</a>
</div>
</div>
</body>
</html>

Output :

10. Sliding Menu

<html>
<head>
<title>Sliding menu</title>
<style>
a{

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
53
display: block;
}
.branch{
position: absolute;
background-color: yellowgreen;
padding: 10px;
width: 200px;
left: -200px;
transition: 1s ease-in-out;
}
.branch:hover{
left: 0px;
}
</style>
</head>
<body>
<div class="branch">
<a href="#">IF</a>
<a href="#">CO</a>
<a href="#">AIML</a>
</div>
</body>
</html>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
54
11. Highlighted Menu

<html>
<head>
<style>
.link:hover{
background-color: grey;
}
</style>
</head>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
55
<body>
<a class="link" href="#">IF</a>
<a class="link" href="#">CO</a>
<a class="link" href="#">AIML</a>
</body>
</html>

Output :

12. Folding tree menu

<html>
<head>
<style>
ul, #myUL {
list-style-type: none;
}
.caret::before {

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
56
content: "\25B6";
color: black;
display: inline-block;
}
.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>
<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>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
57
</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>

Output :

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
58
13. Context menu

<html>
<head>
<style>
div {
background: yellow;
border: 1px solid black;
padding: 10px;
}
</style>
</head>
<body>
<div contextmenu="mymenu">
<p>Right-click inside this box to see the context menu!
<menu type="context" id="mymenu">
<menuitem label="Refresh"></menuitem>
<menu label="Share on...">
<menuitem label="Twitter"></menuitem>
<menuitem label="Facebook"></menuitem>
</menu>
<menuitem label="Email This Page"></menuitem>
</menu>
</div>
</body>
</html>

14. Scrollable Menu

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
59
<html>
<head>
<style>
div.scrollmenu {
background-color: #333;
overflow: auto;
white-space: nowrap;
}
div.scrollmenu a {
display: inline-block;
color: white;
padding: 14px;
}
</style>
</head>
<body>
<div class="scrollmenu">
<a href="#home">Home</a>
<a href="#news">News</a>
<a href="#contact">Contact</a>
<a href="#about">About</a>
<a href="#support">Support</a>
<a href="#blog">Blog</a>
<a href="#tools">Tools</a>
<a href="#base">Base</a>
<a href="#custom">Custom</a>
<a href="#more">More</a>
<a href="#logo">Logo</a>
<a href="#friends">Friends</a>
<a href="#partners">Partners</a>
<a href="#people">People</a>
<a href="#work">Work</a>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
60
</div>
</body>
</html>

Output :

15. Side Bar

<html>
<head>
<style>
.sidebar{
position:fixed;
background-color: pink;
padding:10px;
}
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
61
.sidebar a{
display:block;
}
</style>
</head>
<body>
<div class="sidebar">
<a href="#home"> Home</a>
<a href="#vision">Vision </a>
<a href="#mission"> Mission</a>
<a href="#prog">Programs</a>
</div>
</body>
</html>

Output :

16. Disabling right click

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
62
<script>
window.onload = function(){
document.addEventListener("contextmenu", function(e){
e.preventDefault();
}, false);}
</script>
</head>
<body>
<h3>Right click on screen,Context Menu is disabled</h3>
</body>
</html>

Output :

17. Concealing Your E-mail Address

<html>
<head>
<title>Conceal Email Address</title>
<script>
function CreateEmailAddress(){
var x = 'abcxyz*c_o_m'
var y = 'mai'
var z = 'lto'
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
63
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>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
64
Examination Paper Analysis

Topic Summer-23 Winter-22 Summer-22

Name of Topic
No.
Question Marks Question Marks Question Marks
1.(a) 2 1.(a) 2 1.(a) 2
1.(b) 2 1.(b) 2 1.(c) 2
1.(c) 2 1.(c) 2 2.(a) 4
1 Basics of JavaScript Programming 2.(a) 4 1.(e) 2 4.(a) 4
2.(b) 4 5.(a) 6
2.(c) 4
Total 18 8 18
1.(d) 2 1.(d) 2 2.(b) 4
1.(e) 2 2.(a) 4 4.(b) 4
2.(d) 4 2.(b) 4 5.(b) 6
3.(a) 4 2.(c) 4 6.(c) 6
2 Array, Function and String 3.(b) 4 2.(d) 4
3.(c) 4 3.(a) 4
3.(b) 4
3.(c) 4
Total 20 30 20
1.(f) 2 1.(f) 2 1.(d) 2
5.(a) 6 5.(a) 6 1.(e) 2
3 Form and Event Handling 5.(b) 6 6.(a) 6 2.(c) 4
6.(a) 6 3.(c) 4
Total 20 14 14
1.(g) 2 1.(b) 2
4.(c) 4 1.(e) 2
5.(a) 6 1.(g) 2
4 Cookies and Browser Data 3.(d) 4
5.(b) 6 2.(d) 4
3.(a) 4
6.(a) 6
Examination Paper Analysis

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

Exam Unit No and Question no as per MSBTE paper Marks

Year Name
Summer Unit 1 1.(a) State the ways to display the output in JavaScript 2
-2023 Basics of 1.(b) List the logical operators in JavaScript with description 2
JavaScript 1.(c) Write JavaScript to create object “student”with properties roll number 2
Programming ,name,branch,year,Delete branch property and display remaining properties of student object.
2.(a) Explain getter and setter properties in JavaScript with suitable example. 4
2.(b) Explain Object creation in JavaScript using ‘new’ keyword with adding properties and methods 4
with example
2.(c) Write a JavaScript for loop that will iterate from 1 to 15. For each iteration it will check if the 4
current number is obb or even and display a message to the screen
Sample Output:
“1 is odd”
“2 is even”
….............
…....
Winter - Unit 1 1.(a) State the use of method in JavaScript with the help of suitable example. 2
2022 Basics of 1.(b) List & explain datatypes in JavaScript 2
JavaScript 1.(c) Write a simple calculator program using switch case in JavaScript. 2
Examination Paper Analysis
Programming 1.(e) Describe property Getters & Setter. 2
Summer Unit 1 1.(a) State the features of JavaScript. 2
-2022 Basics of 1.(c) Write a JavaScript program to check whether entered number is prime or not. 2
JavaScript 2.(a) Write a JavaScript program to validate user accounts for multiple set of user 4
Programming ID and password (using switch case statement).
4.(a) Differentiate between For-loop and For-in loop. 4
5.(a) Write a JavaScript to checks whether a passed string is palindrome or not. 4
Summer Unit 2 1.(d) Write JavaScript that initializes an array called Colors with the names of 3 Colors and display 2
-2023 Array, array elements.
Function and 1.(e) Explain calling a function with arguments in JavaScript with example. 2
String 2.(d) Write the use of charCodeAt() and from CharCode() method with syntax and example 4
3.(a) Differentiate between push() and join() method of array object with respect to 4
use,syntax,return value and example.
3.(b) Write a Javascript code to perform following operation on string (Use split() method) 4
Input string : Sudha Narayana Murthy”
Display output as
First Name:Sudha
Middle Name: Narayana
Last Name: Murthy
3.(c) Explain splice() method of array object with syntax and example. 4
Winter - Unit 2 1.(d) Write a program using sort method of array object. 2
2022 Array, 2.(a) Write a JavaScript program that will display current date in DD/MM/YYYY 4
Function and format.
String 2.(b) Write a JavaScript program that will remove the duplicate element from an 4
Array.
(c) Write a JavaScript program that will display list of student in ascending order 4
according to the marks & calculate the average performance of the class.
Examination Paper Analysis

4
4

2.(d) Write and explain a string functions for converting string to number and
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

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.

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

Winter- Unit 4 Q1 g. Describe browser location object. 2

2022 Q5 a. Write HTML script that will display following structure 6
6
8
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.
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

Exam Unit No and Question no as per MSBTE paper Marks

Year Name
Summer Unit 1 1.(a) State the ways to display the output in JavaScript 2M
-2023 Basics of Ans:
JavaScript one
Programmin • Writing into an HTML element, using inner HTML. way for
g • Writing into the HTML output using document.write(). ½ mark
• Writing into an alert box, using window.alert().
• Writing into the browser console, using console.log().

1.(b) List the logical operators in JavaScript with description 2M

Ans:
Any
Operator Description Example two
&& and (x < 10 && y > 1) is true operat
|| or (x == 5 || y == 5) is false
or
! not !(x == y) is true
1 mark
for
each
operat
or
Examination Paper Analysis
1.(c) Write JavaScript to create object “student”with properties roll number ,name,branch,year,Delete 2M
branch property and display remaining properties of student object.
Proper
Ans: correct
<script>
logic
var student ={
roll_number:1001 progra
branch:”IF” m2
year:First marks
name:”XYZ”
document.write(student.roll_number+” ”+student.branch+” “ +
student.year+” “ +student.name);
delete student.branch;
document.write(student.roll_number+” ”+student.branch+” “ +
student.year+” “ +student.name);
</script>
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
adding
2) By creating instance of object directly
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:

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('');

// reverse the array values

const reverseArrayValues = arrayValues.reverse();
// convert array to string
const reverseString = reverseArrayValues.join('');

if(string == reverseString) {
document.write('It is a palindrome');
}
else {
document.write('It is not a palindrome');
}
}
//take input
const string = prompt('Enter a string: ');
checkPalindrome(string);
</script>
Examination Paper Analysis
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

// Printing variable values

document.write(colors + "<br>");

</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>
Examination Paper Analysis
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>

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:

var res = String.fromCharCode(72, 69, 76, 76, 79);

document.write("<br>"+res1);
</script>
</body>
</html>
Examination Paper Analysis
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();
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>
Examination Paper Analysis
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>
<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>
Examination Paper Analysis
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

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
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>
Examination Paper Analysis
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]/;
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');
}
Examination Paper Analysis
</script>
Examination Paper Analysis
3.(c) Write a JavaScript function to merge two array & removes all duplicate
values.
Ans:
<html>
<body>
<script>
function merge_array(array1, array2)
{
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);
Examination Paper Analysis
var uniqueArr = [];
// loop through array
for(var i of arr) {
if(uniqueArr.indexOf(i) === -1)
{
uniqueArr.push(i);
}
}
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
Examination Paper Analysis

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)
{
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>");
Examination Paper Analysis
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)
{
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>
Examination Paper Analysis
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.

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>
Examination Paper Analysis
</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>
<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;
}
Examination Paper Analysis
}
}
</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.

5.(a) Write HTML script that will display following structure

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
Examination Paper Analysis
{
border: solid black 1px;
border-collapse: collapse;
}
td
{
padding: 10px;
}
</style>
</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)
Examination Paper Analysis
{
alert("Please enter value in all fields.")
}
else
{
var pinpattern =/^[4]{1}[0-9]{5}$/;
if( pinpattern.test(pin))
{
alert("Perfect Pin code");
}
else
{
alert("Wrong Pin code.");
}
}
}
</script>
</html>
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
user selects any options. It will change the background colour of webpage.
Ans:
<html>
<body>
<label for="color">Choose a Background Color:</label>
<select name="color" id="color" class="color" onchange="changeColor()">
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
<option value="yellow">Yellow</option>
</select>
<script type="text/javascript">
function changeColor() {
var color = document.getElementById("color").value;
switch(color){
case "green":
document.body.style.backgroundColor = "green";
break;
case "red":
Examination Paper Analysis
document.body.style.backgroundColor = "red";
break;
case "blue":
document.body.style.backgroundColor = "blue";
break;
case "yellow":
document.body.style.backgroundColor = "yellow";
break;
default:
document.body.style.backgroundColor = "white";
break;
}
}
</script>
</body>
</html>
Summer- Unit 3 1.(d) Explain following form events : 2
2022 Form and (i) onmouseup
Event (ii) onblur
Handling Ans: 2
The onmouseup event occurs when a mouse button is released over an element.
4
Example:
<p id="myP" onmousedown="mouseDown()" onmouseup="mouseUp()">
The mouseDown() function sets the color of this text to red. 4
The mouseUp() function sets the color of this text to blue.
</p>

The onblur event occurs when an HTML element loses focus.

Example:
<input type="text" id="fname" onblur="myFunction()">
<script>
function myFunction() {
let x = document.getElementById("fname");
x.value = x.value.toUpperCase();
}

1.(e) Write a javascript program to changing the contents of a window.

Ans:
In following example, we are creating only one object of window and each time same window remain open and
Examination Paper Analysis
content of window changes.
<html>
<body>
<script>
function openWin1(ad)
{
myWindow = window.open(ad, "myWindow", "width=500,height=500");
}
</script>
<button value="Google" onclick="openWin1('https://www.google.com')">Google</button>
<button value="Vidyalankar" onclick="openWin1('http://vpt.edu.in')">Vidyalanakr</button>
</body>
<html>

2.(c) Write a javascript program to demonstrate java intrinsic function.

Ans:
An intrinsic function is often used to replace the Submit button and the Reset button with your own graphical
images, which are displayed on a form in place of these buttons.

Example:
<html>
<head>
<title>Using Intrinsic JavaScript Functions</title>
</head>
<body>
<FORM name="contact" action="#" method="post">
<P>
First Name: <INPUT type="text" name="Fname"/> <BR>
Last Name: <INPUT type="text" name="Lname"/><BR>
Email: <INPUT type="text" name="Email"/><BR>
<img src="submit.jpg"
onclick="javascript:document.forms.contact.submit()"/>
<img src="reset.jpg"
onclick="javascript:document.forms.contact.reset()"/>
</P>
</FORM>
</body>
</html>
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;
}

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>
<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>
Examination Paper Analysis
</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>
<h1>The Window Location Object</h1>
<p id="demo"></p>
<script>
let origin = window.location.origin;
document.getElementById("demo").innerHTML = origin;
</script>
</body>
</html>
Q5 a. Write HTML script that will display following structure
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>
</head>
<body>
<table>
<tbody>
<tr>
<td>Name : </td>
<td> <input type="text" id="name" required></td>
</tr>
<tr>
Examination Paper Analysis

<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.")
}
else
{
var pinpattern =/^[4]{1}[0-9]{5}$/;
if( pinpattern.test(pin))
{
alert("Perfect Pin code");
}
else
{
alert("Wrong Pin code.");
Examination Paper Analysis

}
}
}
</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/>
<input type="button" value="Submit" onclick="storeCookie()"/>
<p id="panel"></p>
</form>
</body>
</html>
Summer Unit 4 Q1 b. Differentiate between session cookies and persistent cookies. 2
-2022 Ans: 2
Session Cookies persistent cookies 2
It resides in memory for the length of the A persistent cookie is a cookie that is assigned 4
browser session. an expiration date. 4
Examination Paper Analysis

6
Also known as an in-memory cookie Also known as transient cookie.

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.

Q1 e. Write a JavaScript program to changing the contents of a window.

Ans:
In following example, we are creating only one object of window and each time same window remain
open and content of window changes.
<html>
<body>
<script>
function openWin1(ad)
{
myWindow = window.open(ad, "myWindow", "width=500,height=500");
}
</script>
<button value="Google" onclick="openWin1('https://www.google.com')">Google</button>
<button value="Vidyalankar" onclick="openWin1('http://vpt.edu.in')">Vidyalanakr</button>
</body>
<html>

Q1 g. Write a JavaScript syntax to accessing elements of another child window.

Ans:
From the top level window that contains the iFrame you start by getting a reference to the iFrame by
using plain old getElementById to select the iFrame by Id. Alternately you can also access the frame via
window.frames[0] (or appropriate numeric index). Once the iFrame is selected you can use the
contentDocument property to access the child frame content. From there you can access document
methods as you normally would – in this case by using getElementById() and then assigning some
HTML to the display <div> tag in the child frame.
Examination Paper Analysis

Example: window.frames[0].showMessage("Hello from Main Page in iFrame");

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>
</form>
</body>
</html>

Q3 a. Write a JavaScript program to create read, update and delete cookies.

Ans:
<html>
<head>
<script>
function writeCookie()
{
Examination Paper Analysis

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" type="button" onclick="writeCookie()">
<input type="Reset" value="Get" type="button" onclick="readCookie()">
</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>
Examination Paper Analysis

<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>

im.html
<html>
<head>
<title>Web Page 1</title>
</head>
<body>
<img src="i.png">
</body>
</html>
Examination Paper Analysis

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>
<a onmouseover="document.clr.src='red.png' ">
<b><u> Red Color</u></b></a>
<br>
<a onmouseover="document.clr.src='green.png' ">
<b><u> Green Color</u></b></a>
</td>
</tr>
</tbody>
</table>
</body>
</html>
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()
{
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);
{
Examination Paper Analysis

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,
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

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>
</html>

Frame1.html

<html>
<body>
<center><b>frame1
</body>
</html>

Frame2.html

<html>
<head>
Examination Paper Analysis

<body>
Welcome to Sport Page
</body>
</html>

Frame3.html

<html>
<head>
<body>
Welcome to Music Page
</body>
</html>

Frame4.html

<html>
<head>
<body>
Welcome to Dance Page
</body>
</html>

Frame5.html

Frame6.html
Examination Paper Analysis

<html>
<head>
<body>
<button onclick=”Frame2.html”>Sport</button>
</body>
</html>

Frame7.html

<html>
<head>
<body>
<button onclick=”Frame3.html”>Sport</button>
</body>
</html>

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;
Examination Paper Analysis

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
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.
Examination Paper Analysis

Sr.No Expression & Description

1 p+
It matches any string containing one or more p's.
2 p*
It matches any string containing zero or more p's.
3 p?
It matches any string containing at most one p.(zero or one occurrences)
4 p{N}
It matches any string containing a sequence of N p's
5 p{2,3}
It matches any string containing a sequence of two or three p's.
6 p{2, }
It matches any string containing a sequence of at least two p's.
7 p$
It matches any string with p at the end of it.

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>
Examination Paper Analysis

Q4 d. Describe frameworks of JavaScript & its application.

Ans:
Frameworks of JavaScript:
1. ReactJs
React is based on a reusable component. Simply put, these are code blocks that can be classified as either
classes or functions. Each component represents a specific part of a page, such as a logo, a button, or an
input box. The parameters they use are called props, which stands for properties.
Applications:
React is a JavaScript library developed by Facebook which, among other things, was used to build
Instagram.com.
2. Angular
Google operates this framework and is designed to use it to develop a Single Page Application (SPA).
This development framework is known primarily because it gives developers the best conditions to
combine JavaScript with HTML and CSS. Google operates this framework and is designed to use it to
develop a Single Page Application (SPA). This development framework is known primarily because it
gives developers the best conditions to combine JavaScript with HTML and CSS.
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
Examination Paper Analysis

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
<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>
Examination Paper Analysis

<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>
</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
4
A regular expression is an object that describes a pattern of characters. 6

The JavaScript RegExp class represents regular expressions, and both String and RegExp define methods
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
Examination Paper Analysis

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) {

// regex pattern for phone number

var re =/^\d{10}$/;

// check if the phone number is valid

var result = num.match(re);
if (result) {
document.write('The number is valid.');
}
}
// take input
var number = prompt('Enter a 10 digit mob number ');
validatePhone(number);
</script>
</body>
</html>

Q4 c. Write a JavaScript program to validate email ID of the user using regular expression.
Ans:
Examination Paper Analysis

<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('yogita.khandagale@gmail.com');
</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)
Examination Paper Analysis

{
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%");
}
}
</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>
Examination Paper Analysis

<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>
<select name="contries" id="contries" class="select" onchange="changecontry()">
<option value="india">India</option>
<option value="japan">Japan</option>
<option value="usa">USA</option>
</select>

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

Following are the ways to protect web pages:

1) Hiding Your Code by disabling Right Mouse Click:
The following example shows you how to disable the visitor's right mouse button while the browser
displays your web page. All the action occurs in the JavaScript that is defined in the <head> tag of the
web page.

<html>
<head>
<script>
window.onload = function()
{
document.addEventListener("contextmenu", function(e)
{
e.preventDefault();
Examination Paper Analysis

}, 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.

For example, this can be useful when:

• Clicking on a "Submit" button, prevent it from submitting a form

• Clicking on a link, prevent the link from following the URL

2) Hiding JavaScript
You can hide your JavaScript from a visitor by storing it in an external file on your web server. The
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.

{
document.addEventListener("contextmenu", function(e)
{
e.preventDefault();
}, false);
}

3) Concealing Your E-mail Address

• To conceal an e-mail address, you need to create strings that contain part of the
e-mail address and then build a JavaScript that assembles those strings into the e-mail address,
which is then written to the web page.
• The following example illustrates one of many ways to conceal an e-mail address.
• It also shows you how to write the subject line of the e-mail. We begin by creating four strings:
• The first string contains the addressee and the domain along with symbols
&, *, and _ (underscore) to confuse the bot.
• The second and third strings contain portions of the mailto: attribute name.
Remember that the bot is likely looking for mailto:
• 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()
{
Examination Paper Analysis

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>

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:

1. Load banner advertisements into an array.

2. Determine whether the browser supports the image object.
3. Display a banner advertisement.
4. Pause before displaying the next banner advertisement.

Example:

<html >
<head>
<title>Banner Ads</title>
<script>
Examination Paper Analysis

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>
<body onload="DisplayBanners()" >
<center>
<img src="1.jpg" width="400"
height="75" name="RotateBanner" />
</center>
</body>
</html>

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=” “
Examination Paper Analysis

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,
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>
Examination Paper Analysis

<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>
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">
Examination Paper Analysis

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.
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() {
Examination Paper Analysis

if (document.images) {
CurrentBanner++
if (CurrentBanner == NumOfBanners) {
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="75" name="RotateBanner" /></a>
</center>
</body> </html>
Q6 b. Develop a JavaScript program to create Rotating Banner Ads.
Ans:
<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;
}
Examination Paper Analysis

}
.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>
<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");
Examination Paper Analysis

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>
Summer Unit 6 Q1 f. Explain frame works of JavaScript and its application. 2
-2022 Ans: 4
JavaScript frameworks are a type of tool that makes working with JavaScript easier and smoother. 6
1) Angular 6
2) React
3) Vue.js
4) Node.js
5) Backbone.js

Q3 b. Write a JavaScript program to link banner advertisements to different URLs.

Ans:
<html>
<head>
<title>Link Banner Ads</title>
<script language="Javascript" type="text/javascript">

Banners = new Array('y.jpg','yy.jpg','yyy.jpg')

BannerLink = new Array(
'google.com/','vpt.edu.in/', 'msbte.org.in/');
CurrentBanner = 0;
NumOfBanners = Banners.length;
function LinkBanner(){
document.location.href =
Examination Paper Analysis

"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>
<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.

Following are the ways to protect web pages:

web page.

<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.

For example, this can be useful when:

• Clicking on a "Submit" button, prevent it from submitting a form

• Clicking on a link, prevent the link from following the URL

3) Concealing Your E-mail Address

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>

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.
Examination Paper Analysis

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%">
<img class="mySlides" src="2.jpg" style="width:50%">
<img class="mySlides" src="3.jpg" style="width:50%">
<img class="mySlides" src="4.jpg" style="width:50%">
<img class="mySlides" src="5jpg" style="width:50%">
<img class="mySlides" src="6.jpg" style="width:50%">

<button class="aa" onclick="plusDivs(-1)">❮Back</button>

<button class="bb" onclick="plusDivs(1)">❯Forward</button>
</div>

function plusDivs(n)
{
showDivs(slideIndex += n);
}

function showDivs(n)
{
var i;
var x = document.getElementsByClassName("mySlides");
if (n > x.length)
{
slideIndex = 1
Examination Paper Analysis

if (n < 1)
{
slideIndex = x.length
}
for (i = 0; i < x.length; i++)
{
x[i].style.display = "none";
}
x[slideIndex-1].style.display = "block";
}
</script>
</body>
</html>
V2V EdTech LLP | ALL IMPORTANT Board Questions

TY DIPLOMA VIMP QUESTIONS CSS

1. Explain getter and setter properties in Java script with suitable example.
Ans:
Property getters and setters
1. The accessor properties. They are essentially functions that work on
getting and setting a value.
2. Accessor properties are represented by “getter” and “setter” methods.
In an object literal they are denoted by get and set.
let obj = { get propName() {
// getter, the code executed on getting obj.propName
},
set propName(value) {
// setter, the code executed on setting obj.propName = value
}
};
3. An object property is a name, a value and a set of attributes. The value
may be replaced by one or two methods, known as setter and a getter.
4. When program queries the value of an accessor property, Javascript invoke
getter method(passing no arguments). The return value of this method
become the value of the property.
5. When program sets the value of an accessor property. Javascript
invoke the setter method, passing the value of right-hand side of assignment.
This method is responsible for setting the property value.
If property has both getter and a setter method, it is read/write property.
If property has only a getter method , it is read-only property.
If property has only a setter method , it is a write-only property.
Example:
<html>
<head>
<title>Functions</title>
<body>
<script language="Javascript">
var myCar = {
Color: "blue",
get color()
{ return this.Color;
},

set color(newColor)
{
this.Color = newColor;
}
};
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
document.write("Car color:" + myCar.color)
myCar.color = "red";

document.write("<p>Car color:" + myCar.color);

</script>
</head>
</body>
</html>

2. Explain prompt(), alert(), write() and confirm() method of Java script with
syntax and example.
Ans:
prompt()
The prompt () method displays a dialog box that prompts the visitor for input.
The prompt () method returns the input value if the user clicks "OK". If the
user clicks
"cancel" the method returns null. Syntax: window.prompt (text, defaultText)
Example:
<html>
<script type="text/javascript">
function msg(){
var v= prompt("Who are you?");
alert("I am "+v);
}
</script>
<input type="button" value="click" onclick="msg()"/>
</html>

confirm()
It displays the confirm dialog box. It has message with ok and cancel buttons.
Returns Boolean indicating which button was pressed Syntax:
window.confirm("sometext"); Example :
<html>
<script type="text/javascript">
function msg(){
var v= confirm("Are u sure?");
if(v==true)
{
alert("ok");
}
else{
alert("cancel");
}
}
</script>
<input type="button" value="delete record" onclick="msg()"/>
</html>
.
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
The alert() method displays an alert box with a message and an OK
button.The alert() method is used when you want information to come
through to the user. Syntax:
alert(message) example:
<html>
<body>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
alert("Hello\nHow are you?");
}
</script>
</body>
</html>

3. Write a Java script program which computes, the average marks of the
following students then, this average is used to determine the
corresponding grade.
Ans:
<html>
<head>
<title>Compute the average marks and grade</title>
</head>
<body>
<script>
var students = [['Summit', 80], ['Kalpesh', 77], ['Amit', 88], ['Tejas', 93],
['Abhishek', 65]];
var Avgmarks = 0;
for (var i=0; i < students.length; i++) {
Avgmarks += students[i][1];
}
var avg = (Avgmarks/students.length);
document.write("Average grade: " + (Avgmarks)/students.length);
document.write("<br>");
if (avg < 60){ document.write("Grade : E");
}
else if (avg < 70) { document.write("Grade : D");
}
else if (avg < 80) { document.write("Grade : C");
}
else if (avg < 90) {
document.write("Grade : B");
}
else if (avg < 100) { document.write("Grade : A");
}
</script>
</body>
</html>
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
4. Write the use of chatAt(),fromCharCode(), and indexof() with syntax and
example.
Ans:
charAt()
The charAt() method requires one argument i.e is the index of the character
that you want to copy.
Syntax:
var SingleCharacter = NameOfStringObject.charAt(index); Example:
var FirstName = 'Bob';
var Character = FirstName.charAt(0); //o/p B

indexOf()

The indexOf() method returns the index of the character passed to it as an

argument.
If the character is not in the string, this method returns –1.
Syntax:
var indexValue = string.indexOf('character'); Example:

var FirstName = 'Bob';

var IndexValue = FirstName.indexOf('o'); //o/p index as 1

5. Differentiate between concat() and join() methods of array.

Ans:

concat() join()

The concat() method concatenates (joins) The join() method returns an

two or more arrays. array as a string.
The concat() method returns a new array,
containing the joined arrays.

The concat() method separates each Any separator can be specified.

value with a comma only. The default is comma (,).

Syntax: array1.concat(array2, array3, ..., Syntax: array.join(separator)

arrayX)

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
Example: <script> Example: <script>
const arr1 = ["CO", "IF"]; const arr2 = var fruits = ["Banana", "Orange",
["CM", "AI",4]; const arr = "Apple", "Mango"]; var text =
arr1.concat(arr1, arr2); fruits.join();
document.write(arr); document.write(text); var text1 =
</script> fruits.join("$$");
document.write("<br>"+text1);
</script>

6. Write a JavaScript that will replace following specified value with another
value in string. String = “I will fail” Replace “fail” by “pass”.
Ans:
<html>
<head> <body> <script>
var myStr = ‘I will fail’;
var newStr = myStr.replace(fail, "pass");
document.write(newStr);
</script>
</body>
</head>
</html>

7. Write a Java Script code to display 5 elements of array in sorted order and
Write a javascript function to generate Fibonacci series till user defined
limit.
Ans:
<html>
<head>
</head>
<body>
<script>
// declaration of the variables
var n1 = 0, n2 = 1, next_num, i;
var num = parseInt (prompt (" Enter the limit for Fibonacci Series "));
document.write( "Fibonacci Series: ");
for ( i = 1; i <= num; i++)

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
{
document.write (" <br> " + n1);
next_num = n1 + n2;
n1 = n2;
n2 = next_num;
}

</script>
</body>
</html>

8. List ways of protecting your web page and describe any one of them.
Ans:
Ways of protecting Web Page:
1)Hiding your source code
2)Disabling the right MouseButton
3) Hiding JavaScript
4) Concealing E-mail address.

1) Hiding your source code

2)Disabling the right MouseButton

The following example shows you how to disable the visitor's right mouse
button while the browser displays your web page. All the action occurs in the
JavaScript that is defined in the tag of the web page
<html>
<head>
<script>
window.onload = function()
{
document.addEventListener("contextmenu", function(e)
{
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
e.preventDefault();
},false);}
</script>
<body>
<h3>Rightclickonscreen,ContextMenuisdisabled</h3>
</body>
</html>

3) Hiding JavaScript
You can hide your JavaScript from a visitor by storing it in an external file on
your web server. The external fi le should have the .js fi le 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 fi le, but you won't see the
source code for the JavaScript.
The next example shows how to create and use an external JavaScript file.
First you must tell the browser that the content of the JavaScript is located in
an external file on the web server rather than built into the web page. You do
this by assigning the file name that contains the JavaScripts to the src
attribute of the <script>tag, as shown here:
<script src="MyJavaScripts.js"
language="Javascript" type="text/javascript">
Next, you need to define empty functions for each function that you define in
the external JavaScript file.
webpage.html
<html>
<head>
<scriptsrc="mycode.js"languages="javascript"type="text/javascript">
</script>
<body>
<h3>RightClickonscreen,ContextMenuisdisabled</h3>
</body>
</html>

mycode.js
window.onload=function()
{
document.addEventListener("contextmenu",function(e)
{
e.preventDefault();
},false);
}

4) Concealing E-mail address:

Many of us have endured spam at some point and have probably blamed
every merchant we ever patronized for selling our e-mail address to
spammers.

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
● While e-mail addresses are commodities, it's likely that we ourselves are
the culprits who invited spammers to steal our e-mail addresses.
● Here's what happens: Some spammers create programs called bots that
surf the Net looking for e-mail addresses that are embedded into web pages,
such as those placed there by developers to enable visitors to contact them.
The bots then strip these e-mail addresses from the web page and store them
for use in a spam attack.
● This technique places developers between a rock and a hard place. If they
place their e-mail addresses on the web page, they might get slammed by
spammers.
● The solution to this common problem is to conceal your e-mail address in
the source code of your web page so that bots can't find it but so that it still
appears on the web page.
● Typically, bots identify e-mail addresses in two ways: by the mailto:attribute
that tells the browser the e-mail address to use when the visitor wants to
respond to the web page, and by the @ sign that is required of all e-mail
addresses.
Your job is to confuse the bots by using a JavaScript to generate the e-mail
address dynamically. However, you'll still need to conceal the e-mail address
in your JavaScript, unless the JavaScript is contained in an external
JavaScript file, because a bot can easily recognize the mailto: attribute and
the @ sign in a JavaScript.
● Bot scan also easily recognize when an external file is referenced.
● To conceal an e-mail address, you need to create strings that contain part
of the e-mail address and then build a JavaScript that assembles those
strings into the e-mail address, which is then written to the web page.
● The following example illustrates one of many ways to conceal an e-mail
address.
● It also shows you how to write the subject line of the e-mail. We begin by
creating
four strings:
• The first string contains the address and the domain along with symbols
&, *, and _ (underscore) to confuse the bot.
• The second and third strings contain portions of the mailto: attribute
name. Remember that the bot is likely looking for mailto:
• 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.
● All the strings are then concatenated and assigned to the variable b, which
is then assigned the location attribute of the window object.
<html>
<head>
<title>ConcealEmailAddress</title>
<script>
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
functionCreateEmailAddress()
{
varx='abcxyz*c_o_m'
vary='mai'
varz='lto'
vars='?subject=CustomerInquiry'
x=x.replace('&','@')
x=x.replace('*','.')
x=x.replace('_','')
x=x.replace('_','')
varb=y+z+':'+x+s
window.location=b;
}
</script>
</head>
<body>
<inputtype="button"value="send"onclick="CreateEmailAddress()">
</body>
</html>

9. Create a slideshow with the group of three images, also simulate next and
previous transition between slides in your Java Script
Ans:
<html>
<head> <script>
pics = new Array('1.jpg' , '2.jpg' , '3.jpg');
count = 0;
function slideshow(status)
{
if (document.images)
{
count = count + status;
if (count > (pics.length - 1))
{
count = 0;
}
if (count < 0)
{
count = pics.length - 1;
}
documet.imag1.src = pics[count];
}}
</script>
</head>
<body>
<img src="1.jpg" width="200" name="img1">
<br>
<input type="button" value="Next" onclick="slideshow(1)">

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
<input type="button" value="Back" onclick="slideshow(-1)">
</body>
</html>

10. Explain text rollover with suitable example.

Ans:
You create a rollover for text by using the onmouseover attribute of the <A>
tag ,which is the anchor tag. You assign the action to the onmouseover
attribute the same way as you do with an <IMG> tag.
Let's start a rollover project that displays a flower titles. Additional information
about a flower can be displayed when the user rolls the mouse cursor over
the flower name. In this example, the image of the flower is displayed.
However, you could replace the flower image with an advertisement or
another message that you want to show about the flower.
<html>
<head>
<title>Rollover Text</title>
</head>
<body>
<TABLE width="100%" border="0">
<TBODY>
<TR vAlign="top">
<TD width="50">
<a>
<IMG height="92" src="rose.jpg" width="70" border="0" name="cover">
</a>
</TD>
<TD>
<IMG height="1" src="" width="10">
</TD>
<TD>
<A onmouseover= "document.cover.src='sunflower.jpg'">
<B><U>Sunflower</U></B>
</A>
<BR>
<A onmouseover=
"document.cover.src='jasmine.jpg'">
<B><U>Jasmine</U></B>
</A>
<BR>
<A onmouseover="document.cover.src='rose.jpg'">
<B><U>Rose</U></B>
</A>
</TD>
</TR>
</TBODY>
</TABLE>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
</body>
</html>

11. Write a javascript to create option list containing list of images and then
display images in new window as per selection.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Image Selection</title>
<style>
body {
font-family: Arial, sans-serif;
}
select {
padding: 10px;
margin: 20px;
}
</style>
</head>
<body>
<h1>Select an image to view:</h1>

<select id="imageSelect" onchange="openImageWindow()">
<option value="">--Select Image--</option>
<option
value="https://via.placeholder.com/150/0000FF/808080?text=Image+1">I
mage 1</option>
<option
value="https://via.placeholder.com/150/FF5733/FFFFFF?text=Image+2">I
mage 2</option>
<option
value="https://via.placeholder.com/150/32CD32/FFFFFF?text=Image+3">
Image 3</option>
<option
value="https://via.placeholder.com/150/FFD700/FFFFFF?text=Image+4">I
mage 4</option>
</select>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
var imageWindow = window.open("", "_blank", "width=500,
height=500");
imageWindow.document.write("<img src='" + imageUrl + "'
alt='Selected Image' style='width: 100%; height: auto;'>");
}
}
</script>
</body>
</html>

12. Write a JavaScript program that will remove the duplicate element from an
array.

Ans:
<html>
<body> <script> function mergearr(arr1, arr2)
{
var arr = arr1.concat(arr2);
var uniqueArr = [];
for(var i of arr)
{
if(uniqueArr.indexOf(i) === -1)
{
uniqueArr.push(i);
}
}
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

13. Write HTML script that will display dropdown list containing options such
as Red, Green, Blue and Yellow. Write a JavaScript program such that
when the user selects any options. It will change the background colour of
webpage.
Ans:
<html>
<body>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
<label for="color">Choose a Background Color:</label>
<select name="color" id="color" class="color" onchange="changeColor()">
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
<option value="yellow">Yellow</option>
</select>
<script type="text/javascript"> function changeColor() {
var color = document.getElementById("color").value;
switch(color){
case "green":
document.body.style.backgroundColor = "green";
break;
case "red":
document.body.style.backgroundColor = "red"; break;
case "blue":
document.body.style.backgroundColor = "blue"; break;
case "yellow":
document.body.style.backgroundColor = "yellow"; break;
default:
document.body.style.backgroundColor = "white"; break;
}
}
</script>
</body>
</html>

Fy-Dip [LIVE] (Sem 2) : 4999/- BUY NOW | Sy-Dip [LIVE] (Sem 3 + 4) : 4999/- BUY NOW
Ty-Dip [LIVE] (Sem 3 + 4) : 4999/- BUY NOW | APP Free Content : CHECK NOW
YOUTUBE : CHECK NOW INSTA : FOLLOW NOW | Contact No : 9326050669 /93268814281
SY DIP WHATSAPP Group : JOIN GROUP 1 JOIN GROUP 2 | ALL FREE CONTENT : CHECK NOW

V2V EdTech LLP | ALL IMPORTANT Board Questions

14. Describe Quantifiers, Meta characters with the help of example.

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
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>

Metacharacters
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
A metacharacter is simply an alphabetical character preceded by a backslash that acts
to Give the combination a special meaning.
For instance, you can search for a large sum of money using the ‘\d’ metacharacter:
/([\d]+)000/, Here \d will search for any string of numerical character.
The following table lists a set of metacharacters which can be used in PERL Style
Regular Expressions.

Sr.No. Character & Description

The following table lists a set of metacharacters which can be used in PERL Style
Regular Expressions.
Sr.No. Character & Description
. (dot)
1
a single character
\s
2
a whitespace character (space, tab, newline)
\S
3
non-whitespace character
\d
4
a digit (0-9)
\D
5
a non-digit
\w
6
a word character (a-z, A-Z, 0-9, _)
\W
7
a non-word character
[\b]
8
a literal backspace (special case).
[aeiou]
9
matches a single character in the given set
[^aeiou]
10
matches a single character outside the given set
(foo|bar|baz)
11
matches any of the alternatives specified

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
14. Describe frameworks of JavaScript & its application.
Ans:
Frameworks of JavaScript:
1. ReactJs
React is based on a reusable component. Simply put, these are code blocks
that can be
classified as either classes or functions. Each component represents a
specific part of a
page, such as a logo, a button, or an input box. The parameters they use are
called props, which stands for properties.
Applications:
React is a JavaScript library developed by Facebook which, among other
things, was used to build Instagram.com.
2. Angular
Google operates this framework and is designed to use it to develop a Single
Page
Application (SPA). This development framework is known primarily because it
gives
developers the best conditions to combine JavaScript with HTML and CSS.
Google
operates this framework and is designed to use it to develop a Single Page
Application
(SPA). This development framework is known primarily because it gives
developers the best conditions to combine JavaScript with HTML and CSS.
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:
1. JQuery can be used to develop Ajax based applications.
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
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

15. Develop a JavaScript program to create Rotating Banner Ads with URL.
Ans
<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>
<body onload="DisplayBanners()" >
<img src="1.jpg" width="400" height="75" name="RotateBanner" />
</body>
</html>

16. How to read, write and delete cookie in javascript? Explain with example.
Ans:
Read a Cookie with JavaScript
With JavaScript, cookies can be read like this: var x = document.cookie;
Write a Cookie with JavaScript
You can access the cookie like this which will return all the cookies saved for the
current domain. document.cookie=x;
Example:
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
<html>
<head> <script> function writeCookie()
{ with(document.myform)
{ document.cookie="Name=" + person.value + ";" alert("Cookie written");
}
} function readCookie()
{ var x; if(document.cookie=="") x=""; else x=document.cookie;
document.write(x);
}
</script>
</head>
<body>
<form name="myform" action="">

Enter your name:

<input type="text" name="person"><br>
<input type="Reset" value="Set
Cookie" type="button"
onclick="writeCookie()"> Cookie" type="button"
<input type="Reset" value="Get
onclick="readCookie()">
</form>
</body>
</html>

17. What is status bar? How to create status bar in Javascript.

Ans:
The status property of the Window interface was originally intended to set the
text in the status bar at the bottom of the browser window. However, the
HTML standard now requires setting window.status to have no effect on the
text displayed in the status bar.
Syntax:
window.status = string; var value = window.status;

<html>
<head>
<title>JavaScript Status Bar</title></head>
<body>
<a href="http://www.v2v.edu.in" onMouseOver="window.status='Vision to
Victroy';return true" onMouseOut="window.status='';return true">
Vision 2 Victory
</a>
</body>
</html>

18. What is context menu? How to create it? Explain with example.
Ans:
When we click the right mouse button on our desktop, a menu-like box
appears and this box is called the context menu. In JavaScript, a context
menu event runs when a user tries to open a context menu. This can be done
by clicking the right mouse button.

Example:
<html>
<head>
<style>
div {
background: yellow;
border: 1px solid black;

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
padding: 10px;
}
</style>
</head>
<body>

<menu type="context" id="mymenu">

</div>

</body>
</html>

19. Write a javascript program to validate emailID, pincode, phone of the user
using regular expression.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Validation Example</title>
</head>
<body>
<h2>Validation Form</h2>
<form id="validationForm">
Email:<input type="text" id="email"><br><br>
Name:<input type="text" id="name"><br><br>
Aadhaar Number:<input type="text" id="aadhaar"><br><br>
IP Address:<input type="text" id="ip"><br><br>
Phone Number:<input type="text" id="phone"><br><br>
Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
Pincode:<input type="text" id="pincode"><br><br>
<button type="button" onclick="validateForm()">Validate</button>
</form>

var emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

var namePattern = /^[A-Za-z\s]+$/;
var aadhaarPattern = /^\d{12}$/;
var ipPattern = /^(\d{1,3}\.){3}\d{1,3}$/;
var phonePattern = /^\d{10}$/;
var pincodePattern = /^\d{6}$/;

20. Write a HTML script which displays 2 radio buttons to the users for fruits
and vegetables and 1 option list. When user select fruits radio button
option list should present only fruits names to the user & when user select

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
vegetable radio button option list should present only vegetable names to
the user.

Ans:
<head>
<title>HTML Form</title>
<script language="javascript" type="text/javascript"> function
updateList(ElementValue)
{
with(document.forms.myform)
{
if(ElementValue == 1)
{
optionList[0].text="Mango"; optionList[0].value=1; optionList[1].text="Banana";
optionList[1].value=2; optionList[2].text="Apple"; optionList[2].value=3;
}
if(ElementValue == 2)
{
optionList[0].text="Potato"; optionList[0].value=1;
optionList[1].text="Cabbage"; optionList[1].value=2;
optionList[2].text="Onion"; optionList[2].value=3;
}}
}
</script>
</head>
<body>
<form name="myform" action="" method="post">
<p>
<select name="optionList" size="2">
<option value=1>Mango
<option value=2>Banana
<option value=3>Apple
</select>
<br>
<input type="radio" name="grp1" value=1 checked="true"
onclick="updateList(this.value)">Fruits <input type="radio" name="grp1"
value=2 onclick="updateList(this.value)">Vegetables
<br>
<input name="Reset" value="Reset" type="reset">
</p>
</form>
</body>
</html>

21. Write a script for creating following frame structure FRUITS, FLOWERS
AND CITIES are links to the webpage fruits.html, flowers.html, cities.html

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
respectively. When these links are clicked corresponding data appears in
FRAME 3.
Ans:
<html>
<head>
<title>Frame Demo</title>
</head>
<body>
<table border="1">
<tr>
<td align="center" colspan="2">
FRAME 1
</td>
</tr>
<tr>
<td>
FRAME 2
<ul>
<li>
<a href="fruits.html" target="mainframe">FRUITS</a>
</li>
<li>
<a href="flowers.html" target="mainframe">FLOWERS</a>
</li>
<li>
<a href="cities.html" target="mainframe">CITIES</a>
</li>
</ul>
</td>
<td>
FRAME 3<BR>
<iframe name="mainframe"></iframe>
</td>
</tr>
</table> </body>
</html>

22. Write a javascript to create a pull-down menu with three options [Google,
MSBTE, Yahoo] once the user will select one of the options then user will
be redirected to that site.
Ans:
<head>
<title>HTML Form</title>
<script language="javascript" type="text/javascript">
function getPage(choice)
{
page=choice.options[choice.selectedIndex].value; if(page != "")

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
{
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.yahoo.com">Yahoo</option>
</form>
</body>
</html>

23. 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>
<ul id="myUL">
<li><span class="caret">India</span>
<ul class="nested">
<li>Karnataka</li>
<li>Tamilnaadu</li>
<li><span class="caret">Maharashtra</span>

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
<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>

24. Write a javascript to checks whether a passed string is palindrome or not.

Ans:
<script>
// program to check if the string is palindrome or not function
checkPalindrome(string)
{
// convert string to an array
const arrayValues = string.split(''); // reverse the array values const
reverseArrayValues = arrayValues.reverse();
// convert array to string
const reverseString = reverseArrayValues.join('');

if(string == reverseString) {
document.write('It is a palindrome');
}
else {
document.write('It is not a palindrome');
}

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material
2

Fy-Dip [LIVE] (Sem 2) : 4999/- BUY NOW | Sy-Dip [LIVE] (Sem 3 + 4) : 4999/- BUY NOW
Ty-Dip [LIVE] (Sem 3 + 4) : 4999/- BUY NOW | APP Free Content : CHECK NOW
YOUTUBE : CHECK NOW INSTA : FOLLOW NOW | Contact No : 9326050669 /93268814282
SY DIP WHATSAPP Group : JOIN GROUP 1 JOIN GROUP 2 | ALL FREE CONTENT : CHECK NOW

Free Study Material Buy Ty Diploma Buy Sy Diploma Whatsapp Group for Study Material

Css s24 Model Answer Paper of Summer 2024 Exam Css
0% (2)
Css s24 Model Answer Paper of Summer 2024 Exam Css
31 pages
CPI - 900 Message Mappings
No ratings yet
CPI - 900 Message Mappings
4 pages
W3Schools Quiz Results - Python
0% (1)
W3Schools Quiz Results - Python
14 pages
Advanced C++ Interview Questions You'll Most Likely Be Asked
From Everand
Advanced C++ Interview Questions You'll Most Likely Be Asked
Vibrant Publishers
No ratings yet
C# Interview Questions You'll Most Likely Be Asked
From Everand
C# Interview Questions You'll Most Likely Be Asked
Vibrant Publishers
No ratings yet
PSTags HTML
No ratings yet
PSTags HTML
8 pages
Css Model Ans 22519 W 2022
No ratings yet
Css Model Ans 22519 W 2022
23 pages
2022 Winter Css Model Ans 22519
No ratings yet
2022 Winter Css Model Ans 22519
23 pages
Model Answer Winter 22
No ratings yet
Model Answer Winter 22
23 pages
Css Model Ans 22519 W 2022
No ratings yet
Css Model Ans 22519 W 2022
23 pages
1020243-CSS WINTER 2023 EXAMINATION MODEL ANSWER PAPER V2V
No ratings yet
1020243-CSS WINTER 2023 EXAMINATION MODEL ANSWER PAPER V2V
43 pages
22519-M
No ratings yet
22519-M
31 pages
XXXXX: (Autonomous)
No ratings yet
XXXXX: (Autonomous)
24 pages
2024 Summer Model Answer
No ratings yet
2024 Summer Model Answer
30 pages
Css s24 Model Answer Paper of Summer 2024 Exam Css
No ratings yet
Css s24 Model Answer Paper of Summer 2024 Exam Css
31 pages
Important Instructions To Examiners
No ratings yet
Important Instructions To Examiners
30 pages
Css s24 Model Answer Paper of Summer 2024 Exam Css
No ratings yet
Css s24 Model Answer Paper of Summer 2024 Exam Css
31 pages
csss24
No ratings yet
csss24
31 pages
Oop17432 Winter2016 Model Answer Paper
No ratings yet
Oop17432 Winter2016 Model Answer Paper
32 pages
Module 2 Lesson 2
No ratings yet
Module 2 Lesson 2
7 pages
Css Win 2023
100% (1)
Css Win 2023
25 pages
Basic JavaScript Interview Questions
No ratings yet
Basic JavaScript Interview Questions
19 pages
Question Bank
No ratings yet
Question Bank
23 pages
22619
No ratings yet
22619
38 pages
hemant css practicals 1 to 4 (1)
No ratings yet
hemant css practicals 1 to 4 (1)
14 pages
Tasbiya ST FileHHHHH
No ratings yet
Tasbiya ST FileHHHHH
49 pages
Jaquery Javascript
No ratings yet
Jaquery Javascript
128 pages
Q2 MODULE3 G11 .NET PROG MangaldanNHS
No ratings yet
Q2 MODULE3 G11 .NET PROG MangaldanNHS
10 pages
Java Script: - CGI (Common Gateway Interface) Programs
No ratings yet
Java Script: - CGI (Common Gateway Interface) Programs
61 pages
Css s24 Model Answer Paper of Summer 2024 Exam Css
No ratings yet
Css s24 Model Answer Paper of Summer 2024 Exam Css
31 pages
Oop ASS 2
No ratings yet
Oop ASS 2
9 pages
Flowcharts and Pseudocode
No ratings yet
Flowcharts and Pseudocode
6 pages
CSSmanual
No ratings yet
CSSmanual
19 pages
CSS Ut1 Answers
No ratings yet
CSS Ut1 Answers
22 pages
PDF
No ratings yet
PDF
23 pages
Javascript
No ratings yet
Javascript
23 pages
CSS (22519)
No ratings yet
CSS (22519)
8 pages
DS230-Assignment 2
No ratings yet
DS230-Assignment 2
6 pages
Module 3 Guided Notes_Using Abstractions
No ratings yet
Module 3 Guided Notes_Using Abstractions
10 pages
MCS-024 Object Oriented Technologies and Java Programming
100% (1)
MCS-024 Object Oriented Technologies and Java Programming
5 pages
W22 JPR Msbteallclear.com
No ratings yet
W22 JPR Msbteallclear.com
24 pages
CSS Practical 1 To 4
No ratings yet
CSS Practical 1 To 4
10 pages
day1-6 java
No ratings yet
day1-6 java
18 pages
Mid v2 copy
No ratings yet
Mid v2 copy
5 pages
JAVA_Lab_Manual_2024-25
No ratings yet
JAVA_Lab_Manual_2024-25
45 pages
22316OOPanswer S19
No ratings yet
22316OOPanswer S19
27 pages
day1-6 cpp
No ratings yet
day1-6 cpp
15 pages
Important Instructions To Examiners:: (Any Four Keywords Mark Each)
No ratings yet
Important Instructions To Examiners:: (Any Four Keywords Mark Each)
26 pages
IPRG5111_Lecture 4S_2024
No ratings yet
IPRG5111_Lecture 4S_2024
81 pages
KMPH PDF
No ratings yet
KMPH PDF
8 pages
PHP W24 Model Answer by Campusify
No ratings yet
PHP W24 Model Answer by Campusify
39 pages
Chap2 (Basic C++ Prog)
No ratings yet
Chap2 (Basic C++ Prog)
14 pages
Css Win 2023
No ratings yet
Css Win 2023
25 pages
Javascript Borad Paper Questions
No ratings yet
Javascript Borad Paper Questions
14 pages
Java Script
No ratings yet
Java Script
9 pages
C Programming Unit 2
No ratings yet
C Programming Unit 2
27 pages
11CA 14 Introduction To JavaScript v2
No ratings yet
11CA 14 Introduction To JavaScript v2
7 pages
Prog-In-C-Unit-2 Studoc
No ratings yet
Prog-In-C-Unit-2 Studoc
27 pages
Model Answer-17332 (PR - Test - 50 - 1) - FIRST
No ratings yet
Model Answer-17332 (PR - Test - 50 - 1) - FIRST
21 pages
CPP by Sourav Kumar Giri PDF
0% (1)
CPP by Sourav Kumar Giri PDF
133 pages
Experiment No. 01 Title: - Develop Javascript To Use Decision Making and Looping Statements. D.O.P
No ratings yet
Experiment No. 01 Title: - Develop Javascript To Use Decision Making and Looping Statements. D.O.P
8 pages
Python Advanced Programming: The Guide to Learn Python Programming. Reference with Exercises and Samples About Dynamical Programming, Multithreading, Multiprocessing, Debugging, Testing and More
From Everand
Python Advanced Programming: The Guide to Learn Python Programming. Reference with Exercises and Samples About Dynamical Programming, Multithreading, Multiprocessing, Debugging, Testing and More
Marcus Richards
No ratings yet
Lexicon of Programming Terminology: Lexicon of Tech and Business, #17
From Everand
Lexicon of Programming Terminology: Lexicon of Tech and Business, #17
Mustafa Al-Dori
5/5 (1)
The GNU C Preprocessor: User Manual
No ratings yet
The GNU C Preprocessor: User Manual
87 pages
Keyboard Shortcuts that Works on Both Windows 11 & Windows 10 - GeeksforGeeks
No ratings yet
Keyboard Shortcuts that Works on Both Windows 11 & Windows 10 - GeeksforGeeks
9 pages
Module 2 - COSC95 - Evolution of Major Programming Language - VCB
No ratings yet
Module 2 - COSC95 - Evolution of Major Programming Language - VCB
8 pages
Mern Stack Online
100% (1)
Mern Stack Online
22 pages
Web Laboratory Manual
0% (1)
Web Laboratory Manual
75 pages
Webinar 1519 Slides
No ratings yet
Webinar 1519 Slides
44 pages
Unit 3 - Web Technology
No ratings yet
Unit 3 - Web Technology
58 pages
12.00 SN-SSNF-K010 Lab Answer Guide
No ratings yet
12.00 SN-SSNF-K010 Lab Answer Guide
9 pages
Hiring 2024
No ratings yet
Hiring 2024
38 pages
ReactJs Step-By-Step Tutorial Series For Absolute Beginners - Part 1 - by Jinal Shah - Medium
No ratings yet
ReactJs Step-By-Step Tutorial Series For Absolute Beginners - Part 1 - by Jinal Shah - Medium
6 pages
Python Keywords
No ratings yet
Python Keywords
3 pages
175 16sccit4-16sccca3-16scccs3 2020051602435211 PDF
No ratings yet
175 16sccit4-16sccca3-16scccs3 2020051602435211 PDF
126 pages
Vaadin 14 Reference Card
No ratings yet
Vaadin 14 Reference Card
8 pages
Emiliano Q. 1015596588
No ratings yet
Emiliano Q. 1015596588
9 pages
Yadav Raviranjan R: Area of Interest Career Objective
No ratings yet
Yadav Raviranjan R: Area of Interest Career Objective
1 page
Viraj Zaveri Software Engineer
No ratings yet
Viraj Zaveri Software Engineer
2 pages
Prashant Resume
No ratings yet
Prashant Resume
1 page
Full Stack Developer Profiles - Capgemini - 12182023
No ratings yet
Full Stack Developer Profiles - Capgemini - 12182023
7 pages
Javascript Events, Forms & Ajax
No ratings yet
Javascript Events, Forms & Ajax
6 pages
Report (Priyanka)
No ratings yet
Report (Priyanka)
45 pages
Servlet Programming
No ratings yet
Servlet Programming
3 pages
Unit-2 Jquery Selectors
No ratings yet
Unit-2 Jquery Selectors
9 pages
Internship TEK3
No ratings yet
Internship TEK3
20 pages
Surya CV Resume
No ratings yet
Surya CV Resume
1 page
Associate Project Guide PDF
No ratings yet
Associate Project Guide PDF
50 pages
CRM Presentation 2
No ratings yet
CRM Presentation 2
11 pages
What Is Factory Function Constructor With Examples by chatGPT
No ratings yet
What Is Factory Function Constructor With Examples by chatGPT
12 pages