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

JS Exercise

Uploaded by

s13013660
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
12 views

JS Exercise

Uploaded by

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

JS Exercise :1

These use cases illustrate the versatility of the onclick() event in JavaScript,
enabling developers to create interactive and dynamic web applications tailored
to user actions and preferences.

Attempt any 20 use case and submit on your LMS also mention the
question number .

1. Display an Alert: Show a simple alert message.


2. Change Text Content: Change the text of a paragraph.
3. Hide an Element: Hide a div when clicked.
4. Show an Element: Show a hidden div when clicked.
5. Toggle Visibility: Toggle visibility of an element.
6. Change Background Color: Change the background color of a div.
7. Redirect to Another Page: Redirect to another URL.
8. Log to Console: Log a message to the console.
9. Change Image Source: Change the source of an image.
10.Increase Font Size: Increase the font size of a text element.
11.Play a Sound: Play an audio file on click.
12.Create a New Element: Add a new paragraph to the document.
13.Remove an Element: Remove an element from the DOM.
14.Change CSS Class: Change the class of an element to apply different
styles.
15.Display Current Time: Show the current time in an element.
16.Count Clicks: Count how many times a button has been clicked.
17.Change Text Color: Change the color of text on click.
18.Show Confirmation Dialog: Show a confirmation dialog and act based
on response.
19.Animate an Element: Start a simple animation by changing position.
20.Change Input Value: Change the value of an input field.
21.Generate Random Number: Display a random number on click.
22. Start Timer: Start a simple timer that counts seconds.
23.Open Modal Window: Open a modal dialog on button click.
24.Change Cursor Style: Change cursor style on hover and click.
25.Display User Input: Show user input from a text box in another element.
26.Validate Form Input: Check if form input is valid on submit.
27.Change Border Style: Change border style of an element.
28.Fetch Data from API: Fetch data from an API and display it.
29.Toggle Class on Multiple Elements: Toggle class for multiple elements.
30.Scroll to Top of Page: Scroll back to the top of the page.
31.Display Random Quote: Show a random quote from an array.
32.Change Button Text on Click: Change the text of a button after clicking.
33.Track Mouse Position: Log mouse position when clicking.
34.Filter List Items: Filter items in a list based on user input.
35.Display Loading Spinner: Show loading spinner while fetching data.
36.Change Video Source: Change video source when clicking different
thumbnails.
37.Add Item to Shopping Cart: Add selected item to cart in e-commerce
site.
38.Toggle Dark Mode/Light Mode: Switch between dark and light themes.
39.Show/Hide Password Field: Toggle visibility of password input field.
40.Zoom In/Out Image: Zoom in/out on image when clicked.
41.Display Tooltip on Hover/Click: Show tooltip with additional
information.
42.Submit Form via AJAX Request: Submit form data without refreshing
page.
43.Create Countdown Timer: Create countdown timer that updates every
second.
44.Highlight Table Row on Click: Highlight table row when clicked.
45.Open External Link in New Tab: Open link in new tab/window when
clicked.
46.Download File on Click: Trigger file download when button is clicked.
47.Change Layout Style Dynamically: Switch between grid and list view
for items.
48.Track User Interactions for Analytics: Send user interaction data to
analytics service.
49.Create Image Carousel/Slider Control: Control image slider with
next/prev buttons.
50.Implement Pagination Controls for Lists or Tables
51.Show/Hide Sidebar Navigation
52.Update Progress Bar Based on User Actions
53.Create FAQ Section with Expandable Answers
54.Implement Search Functionality for Filtering Results
55.Trigger Custom Events for Advanced Interactions
56.Use onclick with SVG Elements for Interactive Graphics

You might also like