Scribd
Upload
5 views2 pages

Advanced HTML JS Practice

The document outlines three practice questions for creating web applications using HTML, CSS, and JavaScript. The first question involves building a string matching application that compares two strings for character matches, the second focuses on designing an event management application with a styled registration form, and the third requires creating a form validation script that checks for empty fields, valid email formats, password strength, and phone number formats while providing real-time feedback. Each question includes specific requirements for functionality and design elements.

Uploaded by

md.aarishaleem2025
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
5 views2 pages

Advanced HTML JS Practice

The document outlines three practice questions for creating web applications using HTML, CSS, and JavaScript. The first question involves building a string matching application that compares two strings for character matches, the second focuses on designing an event management application with a styled registration form, and the third requires creating a form validation script that checks for empty fields, valid email formats, password strength, and phone number formats while providing real-time feedback. Each question includes specific requirements for functionality and design elements.

Uploaded by

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

Advanced HTML & Java Script- Practice Questions:

[Link] a String Matching Application using HTML, CSS, and JavaScript that allows users to
compare two strings and determine the number of matching characters at the same
positions. Write a code to accomplish the following requirements:
i. Design a form with two text input fields labeled "String 1" and "String 2".
ii. Add a "Match" button that, when clicked, triggers a JavaScript function named
checkMatch().
iii. The function should compare the characters at the same indices in both strings and
count the number of exact matches.
iv. Display the result inside an <h2> tag with blue text and a lime background.
Example: If "Python" and "Path" are compared, the function should return 3 (matches at
indices 0, 2, and 3).

2. Design a simple event management application using HTML and CSS that follows the Box
Model. Your design should include:
i. A header with the event management title.
ii. An event details box that includes the event name, date, location, and description.
iii. A registration form with fields for the user's name and email.
iv. Use CSS to style elements with padding, margin, border, and box-shadow for a neat
appearance.
v. Ensure that the form button changes color when hovered over.

3. Design a html form and write a JavaScript function that validates form for the

following:

a. If the input fields in a form (e.g., name, email, and password) are not empty.
Display an appropriate error message if any field is left blank.

b. Create a function that checks if the input in the email field is a valid email
format (e.g., example@[Link]) and validate that the "Date of Birth" field
is filled in a correct format (e.g., MM/DD/YYYY)

c. Implement a function that checks the strength of a password. Ensure that the
password has at least 8 characters, including at least one uppercase letter, one
lowercase letter, one number, and one special character.

d. Create a function that ensures the phone number entered is in a valid format
(e.g., 10-digit US phone number).

e. Implement event listeners to validate form fields in real-time as the user types
(e.g., showing a message below the field if the entry is invalid).

You might also like