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

CSS-PreliumAns

The document provides a comprehensive overview of various JavaScript concepts, including window manipulation, cookie management, and intrinsic functions. It includes syntax examples for functions like window.open(), setTimeout(), and methods for creating and reading cookies. Additionally, it covers topics such as regular expressions, session cookies, and event handling in JavaScript.

Uploaded by

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

CSS-PreliumAns

The document provides a comprehensive overview of various JavaScript concepts, including window manipulation, cookie management, and intrinsic functions. It includes syntax examples for functions like window.open(), setTimeout(), and methods for creating and reading cookies. Additionally, it covers topics such as regular expressions, session cookies, and event handling in JavaScript.

Uploaded by

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

1.

Attempt any FIVE of the following :


(a) Explain the syntax for opening window?
 Opening a New Window:
We can use the window.open() method to open a new browser window or tab.
Syntax:
let newWindow = window.open(url, target, features);
• url: The URL to load in the new window (e.g., "https://example.com").
• target: The target for the new window ("_blank" for a new tab, "_self" to replace the current
page).
• features: Optional. A comma-separated list of window features
like width=500,height=400.

(b) what is the use of setTimeout () function ?


 setTimeout () Function allows you to schedule a specific function to triger at a specific time from
current time.
 Syntax:- setTimeout (function, time);
 Example:- setTimeout (“display()”, 1000);

(c) Explain how to create cookies in javascript?


 Creating Cookie
In JavaScript, we can create,read,update and delete a cookie by using document.cookie property.
This property represent all the cookies associated with a document.
To create or store new cookie, assign a name=value string to this property.
Syntax
document.cookie=="name=value;”
Example:-
<html>
<body>
Enter Name<br>
<input type="text" id="nm" >
<br>
Enter Value<br>
<input type="text" id="vl" >
<br><br>
<input type="button" onclick="createCookie()" value="createCookie">
<script>
function createCookie()
{
name=document.getElementById("nm").value;
value=document.getElementById("vl").value;
cookie_str=name+"="+value+";";
document.cookie=cookie_str;
}
</script>
</body>
</html>
(d) Write a javascript program to changing the contents of a window.
<html>
<head>
<title>newWindow.document.write() Example</title>
</head>
<body>
<button onclick="openAndWrite()">Open and Write to New Window</button>

<script>
let newWindow;

function openAndWrite() {
// Opens a new window
newWindow = window.open("", "_blank", "width=500,height=400");

// Modifies the content of the new window


newWindow.document.write("<h1>Hello, this is new content!</h1>");
}
</script>
</body>
</html>
(e) Write a javascript syntax to accessing elements of another child window

Parent.html
<html>
<head>
<title>Parent Window with Frames</title>
</head>
<frameset cols="50%,50%">
<frame src="frame1.html" name="p1">
<frame src="frame2.html" name="p2">
</frameset>
</html>
Frame1.html
<html>
<head>
<title>Frame 1</title>
</head>
<body>
<h1>Frame 1</h1>
<p>This is the first frame.</p>
<script>
function show() {
parent.p2.document.getElementById("content").innerHTML = "Paragraph tag accessed from Frame1";
}
</script>
<input type="button" name="button1" value="Click Me" onclick="show()">
</body>
</html>
Frame2.html
<html>
<head>
<title>Frame 2</title>
</head>
<body>
<h1>Frame 2</h1>
<p id="content">This is the content of frame 2.</p>
</body>
</html>

(f) what are the attributes are used to set position of window .

We can set the position of the new window using moveTo() when opening it using the left and top
parameters, which specify the position relative to the top-left corner of the screen.
Syntax:
window.moveTo(x, y)
Moves the window to a specified position on the screen.

Example:
newWindow.moveTo(200, 150);
2. Attempt any FIVE of the following :

(a) Describe, how to read cookie value and write a cookie value. Explain with example.
The simplest way to to create cookie is to assign value to document.cookie object.
Syntax:
document.cookie="key1=value1;key2=value2;expires=date";
here expire attribute is optional, if you provide the attribute with a valid date and time
then cookie will expire on given data and time , thereafter cookie will not be accessible.
<html>
<body>
Enter Name<br>
<input type="text" id="nm" ><br>
Enter Value<br>
<input type="text" id="vl" ><br><br>
<input type="button" onclick="writeCookie()" value="writeCookie">
<br><br>
<input type="button" onclick="readCookie()" value="readCookie"><br>
<script>
function writeCookie()
{
name=document.getElementById("nm").value;
value=document.getElementById("vl").value;
cookie_str=name+"="+value+";";
document.cookie=cookie_str;
}
function readCookie()
{
cookie_str=document.cookie;
cookieArray=cookie_str.split(";");
for(i=0;i<cookieArray.length;i++)
{
element=cookieArray[i].split("=");
document.write("<br> Cookie Name "+element[0]);
document.write("<br> Cookie Value "+element[1]);
}
}
</script>
</body>
</html>

(b) Write 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 becomes the value of the cookie. Write the JavaScript function for
storing the cookies. It gets executed when the password changes.

<html>
<head>
<title>Storing Passsword in Cookie</title>
</head>
<body>
Enter UserName
<input type="text" id="uN">
<br>
Enter Password
<input type="password" id="pw"><br>
<input type="button" value="Login" onclick="storeCookie()">
<script>
function storeCookie()
{
pwd=document.getElementById("pw").value;
document.cookie="password"+"="+pwd+";";
}
</script>
</body>
</html>
(c) Enlist and explain with example.the use of any two Intrinsic JavaScript functions.

Intrinsic JavaScript functions, also known as built-in functions or native functions, are the functions that are
provided by the JavaScript engine itself. These functions are always available and don't require any external
libraries or imports.
1. eval()
Syntax:
eval(string)
Description:
Evaluates a string of JavaScript code.
Ex
let result = eval("2 + 2");
console.log(result); // Outputs: 4
2. parseInt()
Syntax:
parseInt(string, [radix])
Description:
Converts a string to an integer. The optional radix parameter specifies the base of the numeral system (e.g., 10
for decimal).
Ex:
let number = parseInt("10", 10);
console.log(number); // Outputs: 10
3. parseFloat()
Syntax:
parseFloat(string)
Description:
Converts a string to a floating-point number.
Ex:
let floatNumber = parseFloat("10.5");
console.log(floatNumber); // Outputs: 10.5
4. isNaN()
Syntax:
isNaN(value)
Description:
Determines if a value is NaN (Not-a-Number).
Ex:
let isNotANumber = isNaN("hello");
console.log(isNotANumber); // Outputs: true

(d) State what is regular expression. Explain its meaning with the help of a
suitableexample.

A regular expression is a pattern of characters.
The pattern is used for searching and replacing characters in strings.
The RegExp Object is a regular expression with added Properties and
Methods.
RegExp Methods Methods Description
match() It returns an array containing all the matches
search() Tests for a match in a string and returns index of
the match. It returns -1 if search fails
test() Tests for a match in a string. Returns true or false
exec() Tests for a match in a string. Returns the first
match
replace() It searches for match in a string and replaces the
matched
Substring with a replacement substring
Example:-
<html>
<body>
<script>
let text = "Is this all there is?";
let pattern = /[hil]/gi;
let result = text.match(pattern);
document.write(result);
</script>
</body>
</html>
Output:
I,h,i,l,l,h,i
(e) What is Status bar and how to display moving message on the status line of a window
using JavaScript ?

Status Bar:
Status bar is horizontal window at the bottom of parent window in which application can display various kinds of
status information.
status bar was used to provide information to the user, such as:

• Displaying messages (e.g., "Loading...").


• Showing URLs when hovering over links.
• Providing feedback about form submissions or interactions.

Moving the message along the status bars


We can move the message on status bar using following steps
1. set the message of status bar by assigning value to window.status property
2. apply the two substring() for the message which is assigned to window.status
3. apply the setInterval() for above steps which execute it repeatedly after specific interval.

<html>
<head>
<title>Moving Message in Status Bar</title>
<script>
let message = "This is a moving message in the status bar!";
let position = 0;
function moveMessage() {
window.status = message.substring(position) +" "+ message.substring(0, position);
position++;
if (position > message.length) {
position = 0;
}
}
setInterval(moveMessage, 200);
</script>
</head>
<body>
<h1>Moving Message in Status Bar Example</h1>
</body>
</html>
(f) Write a JavaScript that accepts a string and searches for the pattern “MSBTE”
in thegiven string using regular expressions. If the pattern is found, JavaScript
will displaythat “Pattern is found” else display “Pattern is not found”.

<html>
<body>
Enter a string
<input type="text" id="inputText">
<button onclick="searchPattern()">Search for MSBTE</button>
<p id="result"></p>
<script>
function searchPattern() {
let inputString = document.getElementById("inputText").value;
let regex = /MSBTE/;
if (regex.test(inputString)) {
document.getElementById("result").innerHTML = "Pattern is found";
} else {
document.getElementById("result").innerHTML = "Pattern is not found";
}
}
</script>
</body>
</html>
3. Attempt any FIVE of the following :
(a) Write a JavaScript that accepts user’s first name and domain name of
organization from user. The JavaScript then forms email address as and
displays the results in thebrowser window.

(b) Write a Java script code to display 5 elements of array in sorted order.

<html>
<body>
<script>
let no=[22,27,19,25,9,15];
no.sort(function(a,b))
{
return a-b;
}
document.write(“Sorted Array: ”);
for(let i=0;i<no.length;i++)
{
document.write(no[i]+”<br>”)
}
</script>
</body>
</html>

(c) Explain text and image rollover with suitable example.


Text Rollover
We can create a rollover for text by using the onmouseover attribute of anchor tag
<a> and then assign the action to the onmouseover attribute.
We can change the current image with specific image when moving mouse on text.
Consider example display the flag of nation on moving mouse cursor over the name
of current nation.
Example
<html>
<head>
<title>Text Rollover - Flag Example</title>
</head>
<body>
<h2>Hover over a nation to see its flag:</h2>
<!-- Links that change the image when hovered -->
<a onmouseover="showFlag('india.jpg')" onmouseout="clearFlag()">India</a> |
<a onmouseover="showFlag('usa.jpg')" onmouseout="clearFlag()">USA</a> |
<a onmouseover="showFlag('germany.jpg')" onmouseout="clearFlag()">Germany</a>
<!-- Placeholder for the flag image -->
<img id="flag" src="default.jpg" alt="Flag will appear here">
<script>
// Function to change the flag image
function showFlag(flagSrc) {
document.getElementById("flag").src = flagSrc;
}
// Function to clear the flag (reset to default image)
function clearFlag() {
document.getElementById("flag").src = "default.jpg";
}
</script>
</body> </html>
(d) State what is a cookie ? Explain its need. State characteristics of
persistent cookies.

Cookies in JavaScript are small pieces of data stored on the client-side by the browser.

Cookies help in:

 Session management (e.g., logging users in and maintaining sessions).


 Personalization (e.g., storing user preferences, themes).
 Tracking (e.g., analytics, user behaviour tracking).

Need of Cookies

Cookies are essential for:

1. Maintaining Sessions: HTTP is stateless, meaning it doesn't retain session


information between different page loads. Cookies allow servers to remember users as
they navigate through a site.
2. Storing Preferences: Websites can store user preferences, such as language or theme,
for future visits.
3. Authentication: Cookies can hold tokens that indicate whether a user is logged in or
not.
4. Personalized Content: Allows websites to provide personalized content based on
previous interactions.

Characteristics of a Persistent Cookie

A persistent cookie is one that is saved on a user’s device for a fixed period, even after the
browser is closed. Key characteristics include:

1. Long-Term Storage: Unlike session cookies, which are deleted once the browser is
closed, persistent cookies are stored for a set expiration time.
2. Expiration Date: Persistent cookies have an expiration date assigned. If no expiration
is set, the cookie behaves as a session cookie.
3. Data Retention: They allow websites to retain user preferences, login details, and
other information between sessions.
4. Tracking: These cookies can be used for tracking long-term user activity across
multiple sessions and visits.
5. Security Concerns: Since they persist longer, they can pose higher security risks if
not managed properly.

(e) Write the syntax of and explain use of following methods of JavaScript
Timing Event. setTimeout() setInterval() .

1. setTimeout()
2. setTimeInterval()

setTimeout()
setTimeout() delays the execution of the function.
Syntax:
setTimeout(function, delay);
 function: The function to be executed after the delay.
 delay: The delay in milliseconds before the function is executed.
Example:
<html>
<head>
<title>Timeout Example</title>
</head>
<body>
<script>
setTimeout(function() {
// Shows an alert after 2 seconds (2000 milliseconds)
alert('This will run after 2 seconds');
}, 2000);
</script>
</body>
</html>

setInterval():

setInterval() repeatedly runs a function every specified number of milliseconds(interval)

Syntax

setInterval(function, interval);

function: The function to execute repeatedly.


interval: The interval time (in milliseconds) between function executions.

<html>
<head>
<title>Interval Example</title>
</head>
<body>
<script>
setInterval(function()
{
// Logs a message every second (1000 milliseconds)
console.log('This message repeats every second');
}, 1000);
</script>
</body>
</html>
(f) State and explain with example.what is a session cookie ?

Session Cookies
 Definition: These cookies are temporary and are deleted when the browser is
closed.
 Use Case: They are used to store information that should only persist during the
user's session, such as login status or shopping cart contents.
 Example: If you don't set an expiration date for a cookie, it becomes a session
cookie.
 document.cookie = "sessionToken=abc123; path=/;";
<html>
<body>
Enter Name<br>
<input type="text" id="nm" >
<br>
Enter Value<br>
<input type="text" id="vl" >
<br>
<br>
<input type="button" onclick="createCookie()" value="createCookie">
<br>
<br>
<input type="button" onclick="readCookie()" value="readCookie">
<br>
<script>
function createCookie()
{
name=document.getElementById("nm").value;
value=document.getElementById("vl").value;
cookie_str=name+"="+value+";";
document.cookie=cookie_str;
}
function readCookie()
{
cookie_str=document.cookie;
cookieArray=cookie_str.split(";");
for(i=0;i<cookieArray.length;i++)
{
element=cookieArray[i].split("=");
document.write("<br> Cookie Name "+element[0]);
document.write("<br> Cookie Value "+element[1]);
}
}
</script>
</body>
</html>

You might also like