This project is focused on JavaScript DOM manipulation and form validation. The main goal was to practice selecting, modifying, and interacting with DOM elements dynamically using JavaScript.
Through this project, I learned how to:
-Target specific DOM elements using querySelector and querySelectorAll
-Add, remove, and toggle CSS classes to update UI states
-Validate user inputs in real-time and show error messages
-Create and insert new elements dynamically using the DOM API
-Handle events such as click, input, and submit
-Improve form usability and give users clear feedback
This project helped strengthen my understanding of how JavaScript interacts with the HTML structure and how to build more interactive and responsive forms. 🚀 Features
-Real-time form validation
-Dynamic DOM updates using classList, querySelector, and insertAdjacentHTML
-Interactive UI feedback for valid/invalid inputs
-Custom error messages
-Clean and responsive layout
-Reusable JS functions
🧠 What I Learned
Working on this project helped me understand:
-How to select DOM elements with querySelector and querySelectorAll
-How to add/remove/toggle CSS classes dynamically
-How to create and insert elements using JavaScript
-How to handle events like submit, click, and input
-How to structure validation logic for clean and readable code
-How to improve user experience through live feedback
🛠️ Technologies Used
-HTML5
-CSS3
-JavaScript (Vanilla)
No libraries or frameworks — just pure JavaScript.