Q.List any four features of Java script.

Syntax:
1. JavaScript is a object-based scripting language. function func_name(parameter1 ,parameter2,…,parametern)
2. Giving the user more control over the browser. {
3. It Handling dates and time. //code
4. It Detecting the user's browser and OS, }
5. It is light weighted. Example:
6. Client – Side Technology <script>
7. JavaScript is a scripting language and it is not java. function add(num1,num2)
8. JavaScript is interpreter based scripting language. { return num1 + num2; }
9. JavaScript is case sensitive. add(1,2);
</script>
Q. explain the term in javascript URL
In JavaScript, a URL (Uniform Resource Locator) is a string
that specifies the location of a resource on the internet. It Q. State any two properties and methods of location object.
typically consists of several parts: the protocol (such as "http" 1. hash 2. Host 3. Hostname 4. Href 5. origin
or "https"), the domain name (like "example.com"), and 6. pathname 7. Port 8. Protocol 9. search
optional components like the path, query parameters, and Methods of location object:
fragment identifier. JavaScript provides built-in methods and 1. assign( ) 2. reload( ) 3. replace( )
properties to manipulate and work with URLs, allowing
developers to extract information like the hostname, Q. Give syntax of and explain the use of small “with” clause.
pathname, or search parameters. “with” clause is used to directly access the properties and
method of an object.
Q.3List and explain any six form events Syntax:
1. Onmousedown- Fires when a mouse button is with (object)
pressed down on an element {
2. Onmousemove- Fires when the mouse pointer is //object
moving while it is over an element }
3. onmouseout -Fires when the mouse pointer moves Example:
out of an element <script>
4. onmouseover- Fires when the mouse pointer moves var person ={ name:"Abc", age:18
over an element }
5. onmouseup -Fires when a mouse button is released with(person){ docment.write(name); docment.write(age);
over an element }
</script>
Q.4 Math Functions
1. *Math.abs()*: Q. With the help of suitable example explain the Date
- *Description*: Returns the absolute value of a number, object and any two methods of
which is the number's distance from zero without Date object.
considering its sign. “Date” object is used when we want to perform some
- *Example*: Math.abs(-5) returns 5. operation on date, it has various
2. *Math.random()*: method which helps you performs some task related to date,
- *Description*: Generates a pseudo-random floating-point Example:
number between 0 (inclusive) and 1 (exclusive). <script>
- *Example*: Math.random() might return 0.357896. var date = new Date();
3. *Math.floor()*: document.write(date.getDate()); // get the current date
- *Description*: Rounds a number downward to the document.write(date.getFullYear()); // get the current Year
nearest integer. document.write(date.getMinutes()); // get the current
- *Example*: Math.floor(4.7) returns 4. minutes
4. *Math.pow()*: - *Description*: Raises a base number to </script>
the power of an exponent (base^exponent).
- *Example*: Math.pow(2, 3) returns 8. Q. Differentiate between shift() and push() methods of an
Array object.
Q. State the meaning of "Defining a function". Explain with
the help of an example.
• A function is a block of code that takes some input
to perform some certain
computation.
• The main purpose of the function is to put
commonly used or repeatedly used
task in a function, so instead of writing the code
again and again we can call it
instead.
Q. Explain getter and setter properties in Java script with Q. Write the use of chatAt() and indexof() with syntax and
suitable example. example
Property getters and setters charAt()
1. The accessor properties. They are essentially functions The charAt() method requires one argument i.e is the index
that work on of the character that
getting and setting a value. you want to copy.
2. Accessor properties are represented by “getter” and Syntax:var SingleCharacter =
“setter” methods. In NameOfStringObject.charAt(index);
an object literal they are denoted by get and set. Example:
let obj = { var FirstName = 'Bob'
get propName() { var Character = FirstName.charAt(0); //o/p B
// getter, the code executed on getting obj.propName indexOf()
}, The indexOf() method returns the index of the character
set propName(value) { passed to it as an
// setter, the code executed on setting obj.propName = value argument.
} If the character is not in the string, this method returns –
}; 1.Syntax:var indexValue = string.indexOf('character');
3. An object property is a name, a value and a set of Example:
attributes. The value var FirstName = 'Bob';
may be replaced by one or two methods, known as setter var IndexValue = FirstName.indexOf('o'); //o/p index as 1
and a getter.
This Q. Differentiate between concat() and join() methods of
method is responsible for setting the property value. array object.
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>
<head>
<title>Functions</title>
<body>
<script language="Javascript"> Q. Enlist & explain the use of any two Intrinsic JavaScript
var myCar = {/* Data properties */ Functions.
defColor: "blue",defMake: "Toyota", An intrinsic function (or built-in function) is a function
/* Accessor properties (getters) */ (subroutine) available for use in a
get color() { given programming language whose implementation is
return this.defColor; handled specially by the compiler.
},get make() { You can use intrinsic functions to make reference to a data
return this.defMake; item whose value is derived
},/* Accessor properties (setters) */ automatically during execution.
set color(newColor) { abs() - The ABS function returns the absolute value of the
this.defColor = newColor; argument.
},set make(newMake) { sin() - The SIN function returns a numeric value that
this.defMake = newMake; approximates the sine of the angle or
}};document.write("Car color:" + myCar.color + " Car Make: arc specified by the argument in radians.
"+myCar.make) sqrt() - The SQRT function returns a numeric value that
/* Calling the setter accessor properties */ approximates the square root of
myCar.color = "red"; the argument specified.
myCar.make = "Audi"; Date(): return current date.
/* Checking the new values with the getter accessor Len(): returns number of characters in the text.parseInt() -
properties */ parseInt() function takes string as a parameter and converts it
document.write("<p>Car color:" + myCar.color); // red to integer.
document.write(" Car Make: "+myCar.make); //Audi parseFloat() - parseFloat() function takes a string as
</script> parameter and parses it to a floating
</head> point number.
</body>
</html>
Q. Adding and sorting elements in an array can be Q. An associative array, also known as a dictionary, map, or
illustrated with a simple example. Let's break it down step- hash table, is a data structure that stores data in key-value
by-step: pairs. This allows you to look up values by their
### Adding an Element to an Array corresponding keys efficiently. Associative arrays are
In many programming languages, arrays have a fixed size, so particularly useful when you need a way to quickly retrieve
adding an element might involve creating a new array that data based on a unique identifier.
can accommodate the additional element. In languages like
Python, arrays (lists) can dynamically resize. Here’s an ### Characteristics of Associative Arrays
example in Python: 1. *Key-Value Pair Storage*: Data is stored as pairs of keys
python and values. Each key is unique.
# Original array 2. *Fast Lookup*: Accessing a value by its key is typically very
array = [3, 1, 4, 1, 5] fast.
# Element to add 3. *Dynamic Size*: Associative arrays can grow as needed,
element = 9 and you can add or remove key-value pairs dynamically.
# Add the element to the array ### Example in Python (Dictionary)
array.append(element) Python’s built-in dictionary is a perfect example of an
# Print the updated array associative array.
print(array) python
Output: # Creating an associative array (dictionary)
[3, 1, 4, 1, 5, 9] phone_book = {
### Sorting an Array "Alice": "555-1234",
Once you've added the element, you might want to sort the "Bob": "555-5678",
array. Here's how you can sort the array: "Charlie": "555-8765"
python }# Accessing a value by its key
# Sort the array in ascending order print(phone_book["Alice"]) # Output: 555-1234
array.sort() # Adding a new key-value pair
# Print the sorted array phone_book["David"] = "555-4321"
print(array) # Updating a value
Output: phone_book["Alice"] = "555-0000"
[1, 1, 3, 4, 5, 9] # Reoving a key-value pair
### Complete Example del phone_book["Charlie"]
Combining both steps, here's a complete example in Python: # Iterating over key-value pairs
python for name, number in phone_book.items():
# Initial array print(f"{name}: {number}")
array = [3, 1, 4, 1, 5] ### Example in Java (HashMap)
# Adding a new element In Java, the HashMap class from the java.util package
element_to_add = 9 provides similar functionality.
array.append(element_to_add) java
# Sorting the array import java.util.HashMap;
array.sort() public class Main {
# Display the final sorted array public static void main(String[] args) {
print(array) HashMap<String, String> phoneBook = new
Output: HashMap<>();
[1, 1, 3, 4, 5, 9] phoneBook.put("Alice", "555-1234");
### Example in Java phoneBook.put("Bob", "555-5678");
Here's a similar example in Java: phoneBook.put("Charlie", "555-8765");
java System.out.println(phoneBook.get("Alice
import java.util.Arrays; phoneBook.put("David", "555-4321");
public class Main { phoneBook.put("Alice", "555-0000");
public static void main(String[] args) { phoneBook.remove("Charlie");
int[] array = {3, 1, 4, 1, 5}; for (String name : phoneBook.keySet()) {
int elementToAdd = 9; System.out.println(name + ": " +
int[] newArray = new int[array.length + 1]; phoneBook.get(name));
System.arraycopy(array, 0, newArray, 0, array.length); } }}
newArray[newArray.length - 1] = elementToAdd; ### Key Operations in Associative Arrays
Arrays.sort(newArray); 1. *Insertion*: Adding a new key-value pair.
System.out.println(Arrays.toString(newArray)); 2. *Deletion*: Removing a key-value pair.
} 3. *Update*: Changing the value associated with an existing
} key.
4. *Lookup*: Retrieving the value associated with a key.
5. *Iteration*: Looping through all key-value pairs.
Q. State what is frame ? Explain now it can be created with Q. Develop a JavaScript program to create Rotating Banner
suitable example Ads.
In CSS, a "frame" typically refers to the outer boundary or <html >
container of an element, often used in the context of layout <head>
or design. Frames can be created using various CSS <title>Banner Ads</title>
properties and techniques to define the structure and <script>
appearance of elements on a webpage. Banners = new Array('1.jpg','2.jpg','3.jpg');
### Example: Creating a Frame with CSS CurrentBanner = 0;
<head> function DisplayBanners()
<meta charset="UTF-8"> {if (document.images);
<meta name="viewport" content="width=device-width, {CurrentBanner++;
initial-scale=1.0"> if (CurrentBanner == Banners.length)
<title>Frame Example</title> {CurrentBanner = 0;
</head> }document.RotateBanner.src= Banners[CurrentBanner];
<body> setTimeout("DisplayBanners()",1000);
<div class="frame"> }}</script>
<p class="content">This is a frame created with CSS.</p> </head><body onload="DisplayBanners()" >
</div> <center><img src="1.jpg" width="400"
</body> height="75" name="RotateBanner" />
</html> </center></body></html>

. Q. Write a JavaScript for creating following frame structure:

Q. List and explain any six form events.

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>
Q. Form regular expressions for following : </html>
i) Validation of email address. Step 3) create frame3.html
ii) Validation of adhaar card. Format is <html><body>
dddd - dddd - dddd <h1>FRAME3</h1>
(iii) Validation of phone number. Format is </body></html>
(ddd) -(dddddddd) Step4) create frame_target.html
i) Regular expression for Validation of email address: <html><head>
var validRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA- <title>Create a Frame</title>
Z0-9-]+(?:\.[a-zA-Z0- </head>
9-]+)*$/; <frameset rows="30%,*" border="1">
ii) Validation of adhaar card Format is <frame src="frame1.html" name="a" />
dddd - dddd – dddd <frameset cols="50%,*" border="1">
Regular expression for Validation of adhaar card <frame src="frame2.html" name="b" />
/^[2-9]{1}[0-9]{3}\s[0-9]{4}\s[0-9]{4}$/gm <frame src="frame3.html" name="c" />
iii) Validation of phone number. Format is </frameset>
(ddd) -(dddddddd) </frameset>
Regular expression for Validation of phone number: </html>
var re = /^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-
9]{4,6}$/im;s
Q. Write HTML script that will display dropdown list Q. Write a javascript to create a pull-down menu with three
containing options such as options [Google,
Red, Green, Blue and Yellow. Write a JavaScript program MSBTE, Yahoo] once the user will select one of the options
such that when the then user will be
user selects any options. It will change the background redirected to that site.
colour of webpage. <html>
<html> <head>
<body> <title>HTML Form</title>
<label for="color">Choose a Background Color:</label> <script language="javascript" type="text/javascript">
<select name="color" id="color" class="color" function getPage(choice)
onchange="changeColor()"> {
<option value="red">Red</option> page=choice.options[choice.selectedIndex].value;
<option value="green">Green</option> if(page != "")
<option value="blue">Blue</option> {
<option value="yellow">Yellow</option> window.location=page;
</select> }
<script type="text/javascript"> }
function changeColor() { </script>
var color = document.getElementById("color").value; </head>
switch(color){ <body>
case "green": <form name="myform" action="" method="post">
document.body.style.backgroundColor = "green"; Select Your Favourite Website:
break; <select name="MenuChoice" onchange="getPage(this)">
case "red": <option
document.body.style.backgroundColor = "red"; value="https://www.google.com">Google</option>
break; <option
case "blue": value="https://www.msbte.org.in">MSBTE</option>
document.body.style.backgroundColor = "blue"; <option
break; value="https://www.yahoo.com">Yahoo</option>
case "yellow": </form>
document.body.style.backgroundColor = "yellow"; </body>
break; </html>
default:
document.body.style.backgroundColor = "white"; Q. Write a Java script to modify the status bar using on
break; MouseOver and onMouseOut with links. When the user
}}</script></body></html> moves his mouse over the links, it willdisplay “MSBTE” in
the status bar. When the user moves his mouse awayfrom
Q. Write a webpage that displays a form that contains an the link the status bar will display nothing.
input for user name andpassword. User is prompted to <html>
enter the input user name and password and password <head>
becomes the value of the cookie. Write the JavaScript <title>JavaScript Status Bar</title></head>
function for storing the cookies.It gets executed when the <body>
password changes <a href=" https://msbte.org.in/"
<html> onMouseOver="window.status='MSBTE';return true"
<head> onMouseOut="window.status='';return true">
<script> MSBTE
function storeCookie() </a></body>
{ </html>
var pwd = document.getElementById('pwd').value
document.cookie = "Password=" + pwd + ";". Q. Write a Java Script code to display 5 elements of array in
alert("Cookie Stored\n"+document.cookie); sorted order.
} <html>
</script></head> <head>
<body> <title> Array</title>
<form name="myForm"> </head>
Enter Username <input type="text" id="uname"/><br/> <body>
Enter Password <input type="password" id="pwd"/><br/> <script>
<input type="button" value="Submit" var arr1 = [ “Red”, “red”, “Blue”, “Green”]
onclick="storeCookie()"/> document.write(“Before sorting arra1=” + arr1);
<p id="panel"></p> document.write(“<br>After sorting arra1=” + arr1.sort());
</form> </script>
</body> </body>
</html> </html>
Q. Create a slideshow with the group of three images, also QExplain open() method of window object with syntax and
simulate next and example.
previous transition between slides in your Java Script. Ans The open() method of window object is used to open a
<html> new window and loads the
<head> document specified by a given URL.
<script> MyWindow = window.open()
pics = new Array('1.jpg' , '2.jpg' , '3.jpg'); The open() method returns a reference to the new window,
count = 0; which is assigned to
function slideshow(status) the MyWindow variable. You then use this reference any
{ time that you want to
if (document.images) do something with the window while your JavaScript runs.
{ A window has many properties, such as its width, height,
count = count + status; content, and name—to
if (count > (pics.length - 1)) mention a few. You set these attributes when you create the
{ window by passing
count = 0; them as parameters to the open() method:
} • The first parameter is the full or relative URL of the web
if (count < 0) page that will appear
{ in the new window.
count = pics.length - 1; • The second parameter is the name that you assign to the
} window.
documet.imag1.src = pics[count]; • 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
</script> width of 250 pixels and
</head> displays an advertisement that is an image. All other styles
<body> are turned off.
<img src="1.jpg" width="200" name="img1"> Syntax:
<br> MyWindow = window.open(‘webpage1.html’, 'myAdWin',
<input type="button" value="Next" onclick="slideshow(1)"> 'status=0, toolbar=0,
<input type="button" value="Back" onclick="slideshow(-1)"> location=0, menubar=0, directories=0, resizable=0,
</body> height=250, width=250')
</html> Example:
<html >
Q. Explain text rollover <head>
You create a rollover for text by using the onmouseover <title>Open New Window</title>
attribute of the <A> tag,which is the anchor tag. You assign <script >
the action to the onmouseover attribute the function OpenNewWindow() {
same way as you do with an <IMG> tag. MyWindow = window.open(‘webpage1.html’, 'myAdWin',
Let's start a rollover project that displays a flower titles. 'status=0, toolbar=0,
Additional information location=0,
about a flower can be displayed when the user rolls the menubar=0, directories=0, resizable=0, height=250,
mouse cursor over theflower name. In this example, the width=250')
image of the flower is displayed. However, }
you could replace the flower image with an advertisement or </script>
another messagethat you want to show about the flower. </head>
<body>
<FORM action=" " method="post">
Q. Write a JavaScript that will replace following specified <INPUT name="OpenWindow" value="Open Window"
value with another value in string type="button"
String = “I will fail” onclick="OpenNewWindow()"/>
Replace “fail” by “pass” </FORM>
<html> </body>
<head> </html>
<body>
<script>
var myStr = ‘I will fail’;
var newStr = myStr.replace(fail, "pass");
document.write(newStr);
</script>
</body>
</head>
</html>
Q. Describe regular expression. Explain search () method Secure − If this field contains the word "secure", then the
used in regular cookie may
expression with suitable example. only be retrieved with a secure server. If this field is blank, no
Regular Expression: such
A regular expression is very similar to a mathematical restriction exists.
expression, except a regular expression tells the browser how Name=Value − Cookies are set and retrieved in the form of
to manipulate text rather than numbers by using special key-value
symbols as operators. pairs
Search() method: Cookies were originally designed for CGI programming. The
str.search() method takes a regular expression/pattern as data contained in
argument and search a cookie is automatically transmitted between the web
for the specified regular expression in the string. This method browser and the web
returns the index server, so CGI scripts on the server can read and write cookie
where the match found. values that are
Example: stored on the client.
<html>
<body> Q. Write a JavaScript program that will display current date
<script> in DD/MM/YYYY format
function myFunction() { <!DOCTYPE html>
// input string <html lang="en">
var str = "Good Morning!"; <head>
// searching string with modifier i <meta charset="UTF-8">
var n = str.search(/Morning/i); <meta http-equiv="X-UA-Compatible" content="IE=edge">
document.write(n + '<br>'); <meta name="viewport" content="width=device-width,
// searching string without modifier i initial-scale=1.0">
var n = str.search(/Morning/); <title>Document</title>
document.write(n); </head>
} <body>
myFunction(); <script>
</script> var d=new Date();
</body> var
</html> currentDate=d.getDate()+'/'+(d.getMonth()+1)+'/'+d.getFullY
ear()
Q. List ways of protecting your web page and describe any document.write(currentDate)
one of them. </script>
Ways of protecting Web Page: </body>
1)Hiding your source code </html>
2)Disabling the right MouseButton
3) Hiding JavaScript Q. Write a JavaScript program that will remove the duplicate
4) Concealing E-mail address. element from an array.
<!DOCTYPE html>
Q. Describe, how to read cookie value and write a cookie <html lang="en">
value. <body>
Web Browsers and Servers use HTTP protocol to <script>
communicate and HTTP is a let arr = ["scale", "happy", "strength", "peace", "happy",
stateless protocol. But for a commercial website, it is "happy"];
required to maintain function removeDuplicates(arr) {
session information among different pages. For example, one let unique = [];
user registration for (i = 0; i < arr.length; i++) {
ends after completing many pages. But how to maintain if (unique.indexOf(arr[i]) === -1) {
users' session unique.push(arr[i]);
information across all the web pages. }
Cookies are a plain text data record of 5 variable-length fields }
− return unique;
Expires − The date the cookie will expire. If this is blank, the }
cookie will document.write(removeDuplicates(arr));
expire when the visitor quits the browser. </script>
Domain − The domain name of your site. </body>
Path − The path to the directory or web page that set the </html>
cookie. This
may be blank if you want to retrieve the cookie from any
directory or
page.
Q. Write a java script that displays textboxes for accepting Q. Give syntax of and explain the use of SetTimeOut()
name & email ID & function with the help of
a submit button. Write java script code such that when the suitable example
user clicks on Use of setTimeout()
submit button The setTimeout() method executes a block of code after the
(1) Name Validation specified time. The method
(2) Email ID Validation executes the code only once.
<html> The commonly used syntax of JavaScript setTimeout is:
<head> Its parameters are:
<title>Form Validation</title> function - a function containing a block of code
</head> milliseconds - the time after which the function is executed
<body> The setTimeout() method returns an intervalID, which is a
<form action = "/cgi-bin/test.cgi" name = "myForm" positive integer.
onsubmit = Example: Display a Text Once After 3 Second
"return(validate());"> <script>
<table cellspacing = "2" cellpadding = "2" border = "1"> function greet()
<tr> {
<td align = "right">Name</td> document.write('Hello world');
<td><input type = "text" name = "Name" /></td> }
</tr> setTimeout(greet, 3000);
<tr> document.write('This message is shown first');
<td align = "right">EMail</td> </script>
<td><input type = "text" name = "EMail" /></td> In the above program, the setTimeout() method calls the
</tr> greet() function after 3000
<tr> milliseconds (3 second).
<td align = "right"></td> Hence, the program displays the text Hello world only once
<td><input type = "submit" value = "Submit" /></td> after 3 seconds.
</tr>
</table> Q. State the use of hiding the JavaScript. Explain the steps
</form> needed to accomplish it and
</body> describe the process.
</html> You can hide your JavaScript from a visitor by storing it in an
<script type = "text/javascript"> external file on your web
function validate() { server. The external file should have the .js file extension. The
if( document.myForm.Name.value == "" ) { browser then calls the
alert( "Please provide your name!" ); external file whenever the browser encounters a JavaScript
document.myForm.Name.focus() ; element in the web page. If
return false; you look at the source code for the web page, you'll see
} reference to the external .js file,
if( document.myForm.EMail.value == "" ) { but you won't see the source code for the JavaScript.
alert( "Please provide your Email!" ); webpage.html
document.myForm.EMail.focus() ; <html>
return false; <head>
} <script src="mycode.js" languages="javascript"
var emailID = document.myForm.EMail.value; type="text/javascript">
atpos = emailID.indexOf("@"); </script>
dotpos = emailID.lastIndexOf("."); <body>
if (atpos < 1 || ( dotpos - atpos < 2 )) { <h3> Right Click on screen, Context Menu is disabled</h3>
alert("Please enter correct email ID") </body>
document.myForm.EMail.focus() ; </html>
return false; mycode.js
} window.onload=function()
return( true ); {
} document.addEventListener("contextmenu", function(e)
//--> {
</script> e.preventDefault();
}, false);
}
Q. Write a JavaScript program that will display list of student Q. Write a JavaScript function that will open new window
in ascending order when the user will
according to the marks & calculate the average performance clicks on the button.
of the class <html>
<body>
<button onclick="openWin()">Open "New
Window"</button>
<script>
var myWindow;
function openWin()
{
<html>
myWindow = window.open("", "myWindow",
<body>
"width=400,height=400");
<script>
myWindow.document.write("<p>Hello Everyone.Welcome to
var students = [["Amit", 70],["Sumit", 78],["Abhishek", 71],];
new window.</p>");
var Avgmarks = 0;
}
for (var i = 0; i < students.length; i++) {Avgmarks +=
</script>
students[i][1];
</body>
for (var j = i + 1; j < students.length; j++) {
</html>
if (students[i] > students[j]) {
a = students[i];
Q. Write a JavaScript program that will create pull-down
students[i] = students[j];
menu with three options. Once the user will select the one
students[j] = a
of the options then user will redirected
}
to that website.
}
<html>
}
<head>
var avg = Avgmarks / students.length;
<title>HTML Form</title>
document.write("Average grade: " + Avgmarks /
<script language="javascript" type="text/javascript">
students.length);
function getPage(choice)
document.write("<br><br>");
{
for (i = 0; i < students.length; ++i){
page=choice.options[choice.selectedIndex].value;
document.write(students[i]+"<br>")
if(page != "")
}
{
</script>
window.location=page;
</body>
}
</html>
}
</script>
Q. Write and explain a string functions for converting string
</head>
to number and number to
<body>
string.
<form name="myform" action="" method="post">
To covert string to number we can use parseInt() which
Select Your Favourite Website:
converts a string number to a
<select name="MenuChoice" onchange="getPage(this)">
integer number. Similarly we can use parseFloat(), number()
<option value="select any option">Select</option>
for converting string to
<option
number.
value="https://www.codecademy.com/catalog/language/java
Eg-
script/">
var a=prompt('Enter a number');
CodeAcademy </option>
var b=parseInt(prompt('Enter a number'));
<option value="https://www.msbte.org.in">MSBTE</option>
document.write(typeof a+"<br>");
<option value="https://www.javatpoint.com/javascript-
document.write(typeof b);
tutorial">JavaTpoint</option>
To convert form number to string we can use toString()
</form>
<html>
</body>
<body>
</html>
<p>toString() returns a number as a string:</p>
<script>
let num = 12;
let text = num.toString();
document.write(num)
</script>
</body>
</html>
Q. Describe frameworks of JavaScript & its application. <select name="color" id="color" class="color"
Frameworks of JavaScript: onchange="changeColor()">
1. ReactJs <option value="red">Red</option>
React is based on a reusable component. Simply put, these <option value="green">Green</option>
are code blocks that can be <option value="blue">Blue</option>
classified as either classes or functions. Each component <option value="yellow">Yellow</option>
represents a specific part of a </select>
page, such as a logo, a button, or an input box. The <script type="text/javascript">
parameters they use are called props, function changeColor() {
which stands for properties. var color = document.getElementById("color").value;
Applications: switch(color){
React is a JavaScript library developed by Facebook which, case "green":
among other things, was used document.body.style.backgroundColor = "green";
to build Instagram.com. break;
2. Angular case "red":
Google operates this framework and is designed to use it to document.body.style.backgroundColor = "red";
develop a Single Page break;
Application (SPA). This development framework is known case "blue":
primarily because it gives document.body.style.backgroundColor = "blue";
developers the best conditions to combine JavaScript with break;
HTML and CSS. Google case "yellow":
operates this framework and is designed to use it to develop document.body.style.backgroundColor = "yellow";
a Single Page Application break;
(SPA). This development framework is known primarily default:
because it gives developers the document.body.style.backgroundColor = "white";
best conditions to combine JavaScript with HTML and CSS. break;
Applications: }
Microsoft Office ,Gmail, Forbes, PayPal, Grasshopper, }
Samsung, Delta </script>
3. Vue.js </body>
Vue is an open-source JavaScript framework for creating a </html>
creative UI. The integration
with Vue in projects using other JavaScript libraries is Q. Describe Quantifiers with the help of example.
simplified because it is designed to The frequency or position of bracketed character sequences
be adaptable. and single characters can be
Application: denoted by a special character. Each special character has a
VueJS is primarily used to build web interfaces and one-page specific connotation.
applications. It can also The +, *, ?, and $ flags all follow a character sequence.
be applied to both desktop and mobile app development. Sr.No. Expression & Description
4. jQuery 1p+It matches any string containing one or more p's.
It is a cross-platform JavaScript library designed to simplify 2p*It matches any string containing zero or more p's.
HTML client-side scripting. 3p?It matches any string containing at most one p.(zero or
You can use the jQuery API to handle, animate, and one occurrences)
manipulate an event in an HTML 4p{N}It matches any string containing a sequence of N p's
document, also known as DOM. Also, jQuery is used with 5p{2,3}It matches any string containing a sequence of two or
Angular and React App building three p's.6p{2, }It matches any string containing a sequence
tools. of at least two p's.7p$It matches any string with p at the end
Applications: of it.
1. JQuery can be used to develop Ajax based applications. Example:
2. It can be used to make code simple, concise and reusable. <html>
3. It simplifies the process of traversal of HTML DOM tree. <body>
4. It can also handle events, perform animation and add ajax <button onclick="myFunction()">Try it</button>
support in web applications. <p id="demo"></p>
<script>
Q. Write HTML script that will display dropdown list function myFunction()
containing options such asRed, Green, Blue and Yellow. {var str = "100, 1000 or 10000?";
Write a JavaScript program such that when theuser selects var patt1 = /\d{3,4}/g;
any options. It will change the background colour of var result = str.match(patt1);
webpage document.getElementById("demo").innerHTML = result;
<html> }
<body> </script>
<label for="color">Choose a Background Color:</label> </body>
</html>]
Q. Explain following form control element with Code
example button text textarea select checkbox for <html><head>
<meta charset="UTF-8">
Sure, here's a brief explanation of each form control <meta name="viewport" content="width=device-
element along with an example: width, initial-scale=1.0">
1. *Button*: A button is a clickable element used to <title>Form Controls Example</title>
trigger an action. It can be used to submit a form, </head>
navigate to another page, or perform some <body>
JavaScript functionality. Example: <button>Click <form>
me</button> <label for="text">Text Input:</label><br>
2. *Text area*: A text area is a multi-line text input <input type="text" id="text" name="text"
control where users can enter large amounts of text. value="Sample text"><br><br>
Example: <textarea rows="4" cols="50">Enter your <label for="textarea">Textarea:</label><br>
text here...</textarea> <textarea id="textarea" name="textarea"
3. *Select*: A select element creates a drop-down rows="4" cols="50">Enter your text
list of options from which the user can choose. here...</textarea><br><br>
Example: <label for="select">Select:</label><br>
<select> <select id="select" name="select">
<option value="option1">Option 1</option> <option value="option1">Option 1</option>
<option value="option2">Option 2</option> <option value="option2">Option 2</option>
<option value="option3">Option 3</option> <option value="option3">Option 3</option>
</select> </select><br><br>
4. *Checkbox*: A checkbox allows users to select <label>Checkboxes:</label><br>
one or more options from a list of choices. Example: <input type="checkbox" id="checkbox1"
<input type="checkbox" id="option1" name="checkbox1" value="option1">
name="option1" value="option1"> <label for="checkbox1">Option 1</label><br>
<label for="option1">Option 1</label> <input type="checkbox" id="checkbox2"
<input type="checkbox" id="option2" name="checkbox2" value="option2">
name="option2" value="option2"> <label for="checkbox2">Option 2</label><br><br>
<label for="option2">Option 2</label> <button type="submit">Submit</button>
These elements are fundamental building blocks of </form>
web forms, enabling user interaction and data </body>
collection. </html>