Scribd
Upload
9 views

CSS Practice Test2 Ans

css answers

Uploaded by

riteshdebadwar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
9 views

CSS Practice Test2 Ans

css answers

Uploaded by

riteshdebadwar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 12

CSS Practice test 2 Answers

2 Marks
1. JavaScript to Design a Form to Accept Values for User ID & Password

<html>

<head>

<title>Login Form</title>

</head>

<body>

<form name="loginForm">

<label for="userID">User ID:</label>

<input type="text" id="userID" name="userID"><br><br>

<label for="password">Password:</label>

<input type="password" id="password" name="password"><br><br>

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

</form>

</body>

</html>

2. Two Properties and Methods of location Object

• Properties:

1. location.href: The URL of the current page.

2. location.hostname: The domain name of the web host.

• Methods:

1. location.reload(): Reloads the current page.

2. location.assign(): Loads a new document.

3. Two Intrinsic JavaScript Functions

• parseInt(): Converts a string to an integer. Example:

let num = parseInt("123");

Use: To extract and convert a string representation of a number to an integer.

• isNaN(): Determines if a value is not a number. Example:

if (isNaN("Hello")) {

console.log("This is not a number.");

} Use: To check whether a given value is NaN.


CSS Practice test 2 Answers

4. Browser location Object

The location object contains information about the current URL and allows for navigation between
pages. It can be used to get the URL or parts of it, and to redirect the browser to another URL.

5. Four Mouse Events with Their Use

1. onclick: Triggers when a user clicks on an element.

2. onmouseover: Fires when the mouse pointer is moved over an element.

3. onmouseout: Fires when the mouse pointer is moved out of an element.

4. ondblclick: Triggers when a user double-clicks on an element.

6. Difference Between Session Cookies and Persistent Cookies

Feature Session Cookies Persistent Cookies

Active only for the duration of a


Lifespan Remain on the device until they expire
session

Storage Stored in memory Stored on the hard drive

For temporary data, like login


Use For long-term data like preferences
sessions

Deleted when the browser is Deleted only when the expiry date is met or manually
Deletion
closed removed

7. Form Events

• onmouseup: This event occurs when the mouse button is released over an element. It’s
typically used in combination with onmousedown.

• onblur: This event is triggered when an element loses focus, often used for validating input
fields when the user moves away from a form field.

8. JavaScript Program to Change the Contents of a Window

document.getElementById("content").innerHTML = "The content has been changed!";

9. Accessing Elements of Another Child Window

let childWindow = window.open("child.html");

childWindow.document.getElementById("elementID").value = "New Value";

10. Four Form Elements

1. <input type="text">: Used to input single-line text.

2. <textarea>: Used to input multi-line text.

3. <select>: Dropdown list for selecting an option.

4. <button>: A clickable button for submission or other actions.


CSS Practice test 2 Answers

11. Define Cookies

Cookies are small pieces of data stored by a website on a user's device to remember information
about the user’s visit, such as login state or user preferences.

12. Two Properties and Methods of location Object (Repetition)

• Properties: location.href, location.hostname

• Methods: location.reload(), location.assign()

13. Program to Open Multiple Windows

let window1 = window.open("page1.html");

let window2 = window.open("page2.html");

14. Timing Events Syntax and Explanation

• setTimeout(): Executes a function after a specified delay.

setTimeout(function() {

alert("Hello after 3 seconds!");

}, 3000);

Use: Executes code once after a delay.

• setInterval(): Repeats a function at a specified interval.

setInterval(function() {

console.log("Repeats every 2 seconds");

}, 2000);

Use: Repeats code at regular intervals.

15. Ways of Protecting Your Webpage

1. HTTPS Encryption

2. Input Validation

3. XSS Protection

4. Content Security Policy (CSP)

Explanation of CSP: CSP is a security feature that helps prevent cross-site scripting (XSS) attacks by
specifying which sources are allowed to load content on the webpage.

16. Program to Open a New Window

window.open("https://example.com", "_blank");
CSS Practice test 2 Answers

17. Windows Focus and Blur

• Focus: The event when a window or input field gains focus, meaning it's active and ready for
input.

• Blur: The event when a window or input field loses focus, indicating it is no longer the active
element.

4 Marks
1. What is a Cookie? Explain Its Need. State Characteristics of Persistent Cookies.

Cookie:
A cookie is a small piece of data sent from a website and stored in the user's browser to remember
information between sessions, like login credentials or user preferences.

Need for Cookies:

1. To maintain user sessions (e.g., keeping users logged in).

2. To store user preferences (e.g., language, theme).

3. To track user behavior for analytics or advertisements.

Characteristics of Persistent Cookies:

1. Longer Lifespan: They remain on the user’s device until a specified expiration date.

2. Stored on Disk: Persistent cookies are saved to the user's hard drive, unlike session cookies
stored in memory.

3. Multiple Sessions: They can track data across multiple sessions and browser restarts.

4. Custom Expiration: You can specify an expiration date after which the cookie will be deleted.

2. Create and Read Persistent Cookies in JavaScript

Create a Persistent Cookie:

function setCookie(name, value, days) {

let date = new Date();

date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); // Set expiration in days

let expires = "expires=" + date.toUTCString();

document.cookie = name + "=" + value + ";" + expires + ";path=/";

setCookie("username", "Vedant", 7); // Sets a cookie valid for 7 days


CSS Practice test 2 Answers

Read a Cookie:

function getCookie(name) {

let decodedCookie = decodeURIComponent(document.cookie);

let cookiesArray = decodedCookie.split(';');

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

let cookie = cookiesArray[i].trim();

if (cookie.indexOf(name + "=") === 0) {

return cookie.substring(name.length + 1);

return "";

console.log(getCookie("username")); // Outputs: Vedant

3. Ways of Protecting Your Webpage

1. HTTPS Encryption

2. Input Validation

3. Cross-Site Scripting (XSS) Protection

4. Content Security Policy (CSP)

5. Cross-Site Request Forgery (CSRF) Protection

Description of HTTPS Encryption:


HTTPS secures data exchanged between a browser and a website by encrypting it using SSL/TLS. This
prevents data like passwords and credit card numbers from being intercepted by malicious third
parties.

4. College Admission Form Using HTML Form Tag

<!DOCTYPE html>

<html>

<head>

<title>College Admission Form</title>

</head>

<body>
CSS Practice test 2 Answers

<form action="submit_form.php" method="POST">

<label for="name">Full Name:</label>

<input type="text" id="name" name="name" required><br><br>

<label for="dob">Date of Birth:</label>

<input type="date" id="dob" name="dob" required><br><br>

<label for="gender">Gender:</label>

<input type="radio" id="male" name="gender" value="Male"> Male

<input type="radio" id="female" name="gender" value="Female"> Female<br><br>

<label for="email">Email:</label>

<input type="email" id="email" name="email" required><br><br>

<label for="course">Course Applied For:</label>

<select id="course" name="course">

<option value="BSc">B.Sc.</option>

<option value="BCom">B.Com</option>

<option value="BTech">B.Tech</option>

</select><br><br>

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

</form>

</body>

</html>

5. JavaScript Program to Create, Read, Update, and Delete Cookies

// Create a Cookie

function createCookie(name, value, days) {

let date = new Date();

date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); // Set expiration


CSS Practice test 2 Answers

let expires = "expires=" + date.toUTCString();

document.cookie = name + "=" + value + ";" + expires + ";path=/";

// Read a Cookie

function readCookie(name) {

let decodedCookie = decodeURIComponent(document.cookie);

let cookiesArray = decodedCookie.split(';');

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

let cookie = cookiesArray[i].trim();

if (cookie.indexOf(name + "=") === 0) {

return cookie.substring(name.length + 1);

return "";

// Update a Cookie (just call createCookie again with same name)

function updateCookie(name, value, days) {

createCookie(name, value, days);

// Delete a Cookie

function deleteCookie(name) {

document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

// Usage

createCookie("user", "Vedant", 7);

console.log(readCookie("user")); // Vedant

updateCookie("user", "Vaishnavi", 7);

deleteCookie("user");
CSS Practice test 2 Answers

6. Different Properties of Form Tag

1. action: Specifies where to send the form data when the form is submitted (e.g., URL).

2. method: Specifies how to send form data. Can be either GET or POST.

3. enctype: Specifies how form data should be encoded when submitted (e.g., application/x-
www-form-urlencoded or multipart/form-data for file uploads).

4. target: Specifies where to display the response after form submission (e.g., _blank, _self).

7. Difference Between GET and POST Methods of Form Tag

Feature GET Method POST Method

Visibility Data is appended in URL and visible Data is sent in the body, hidden

Data Length Limited due to URL length restrictions No restrictions on data size

Usage Used for non-sensitive data Used for sensitive data (e.g., passwords)

Caching Can be cached Cannot be cached

Example:

• GET Method:

<form action="/submit" method="GET">

<input type="text" name="username">

<input type="submit">

</form>

• POST Method:

<form action="/submit" method="POST">

<input type="text" name="username">

<input type="submit">

</form>
CSS Practice test 2 Answers

6 Marks
1. Evaluating a Radio Button in JavaScript with Example

To evaluate a radio button in JavaScript, you need to determine which radio button has been selected
from a group of buttons with the same name. This can be done by looping through the group of radio
buttons and checking if any are checked.

Example:

<!DOCTYPE html>

<html>

<head>

<title>Radio Button Evaluation</title>

<script>

function evaluateRadioButton() {

// Get all radio buttons with the name 'gender'

let radios = document.getElementsByName('gender');

// Loop through the radio buttons to find the checked one

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

if (radios[i].checked) {

// Display the value of the selected radio button

alert("Selected gender: " + radios[i].value);

return;

alert("Please select a gender.");

</script>

</head>

<body>

<form>

<label>Gender:</label><br>

<input type="radio" name="gender" value="Male"> Male<br>


CSS Practice test 2 Answers

<input type="radio" name="gender" value="Female"> Female<br>

<input type="radio" name="gender" value="Other"> Other<br><br>

<button type="button" onclick="evaluateRadioButton()">Submit</button>

</form>

</body>

</html>

Explanation:

• The getElementsByName('gender') method is used to retrieve all radio buttons with the
name gender.

• The loop checks if any radio button is checked by evaluating radios[i].checked. If it finds one,
it displays its value.

• If none of the radio buttons are checked, it alerts the user to select one.

2. How to Read and Write Cookie Value in JavaScript

Writing a Cookie

To write a cookie in JavaScript, you use the document.cookie property. You can specify the name,
value, and other options like expiration date and path.

Example:

// Function to create a cookie

function setCookie(name, value, days) {

let date = new Date();

date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); // Expiration in days

let expires = "expires=" + date.toUTCString();

document.cookie = name + "=" + value + ";" + expires + ";path=/";

// Create a cookie named "username" with the value "Vedant", lasting 7 days

setCookie("username", "Vedant", 7);


CSS Practice test 2 Answers

Reading a Cookie

To read a cookie, you access document.cookie, which returns a string of all cookies. You can then
search for the desired cookie using its name.

Example:

// Function to read a cookie by name

function getCookie(name) {

let decodedCookie = decodeURIComponent(document.cookie); // Decodes the cookie string

let cookiesArray = decodedCookie.split(';'); // Split into individual cookies

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

let cookie = cookiesArray[i].trim();

if (cookie.indexOf(name + "=") === 0) {

return cookie.substring(name.length + 1); // Return the cookie value

return ""; // Return an empty string if the cookie is not found

// Read the cookie "username"

console.log(getCookie("username")); // Output: Vedant

Explanation:

• Writing a cookie: setCookie() function creates a cookie by setting its name, value, and
expiration (in days). It uses the document.cookie property.

• Reading a cookie: getCookie() searches for a cookie by its name by splitting the
document.cookie string, and if found, it returns the value of that cookie.

Complete Example (Writing and Reading Cookies)

<!DOCTYPE html>

<html>

<head>

<title>Cookie Example</title>

<script> // Function to create a cookie

function setCookie(name, value, days) {


CSS Practice test 2 Answers

let date = new Date();

date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));

let expires = "expires=" + date.toUTCString();

document.cookie = name + "=" + value + ";" + expires + ";path=/";

// Function to read a cookie

function getCookie(name) {

let decodedCookie = decodeURIComponent(document.cookie);

let cookiesArray = decodedCookie.split(';');

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

let cookie = cookiesArray[i].trim();

if (cookie.indexOf(name + "=") === 0) {

return cookie.substring(name.length + 1);

}}return "";

}// Write and Read Cookie

function handleCookies() {

// Set the cookie

setCookie("username", "Vedant", 7);

// Read the cookie and display it

let username = getCookie("username");

if (username != "") {

alert("Welcome back, " + username);

} else {

alert("No cookie found.");

}}

</script>

</head>

<body>

<button onclick="handleCookies()">Set and Read Cookie</button>

</body>

</html>

You might also like