UI UX Design (36 Blogs) Become a Certified Professional
AWS Global Infrastructure

Front End Web Development

Topics Covered
  • AngularJS (45 Blogs)
  • The Complete WebDeveloper (34 Blogs)
  • ReactJS (14 Blogs)
  • JavaScript and JQuery Essentials Training (2 Blogs)

How To Best Utilize Onclick In JavaScript?

Last updated on Apr 25,2023 2.1K Views

23 / 31 Blog from JavaScript

This article on Onclick in JavaScript will introduce you Onclick event in JavaScript and follow it up with a programmatic demonstration. Following pointers will be covered in this article,

So let us get started then,

onclick In JavaScript: Main Tips

  • This event occurs when the user clicks on an element.
  • It runs a specified line of code when you click an HTML object that has the onclick attribute.
  • Its functions can be triggered by object.onclick or object.addEventListener.
  • The addEventListener method is not supported by earlier versions of Internet Explorer (8 and below).

Moving on with this article “onclick In JavaScript”, let’s see where it is used.

When onclick Is Used?

This event is one of the most frequently utilized event types. It’s a common practice to enhance websites by adding some functionality such as JavaScript button click or other elements.

This function is designed to execute code when users interact with the HTML elements. It can be applied to any HTML element.


<element onclick=”script“>

Next in this onclick In JavaScript article,

Onclick In JavaScript: Attribute Values



The Script to be run


Technical Details

Supported HTML tags: All HTML elements, EXCEPT: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title>


<DOCTYPE html Field1: input type="text" id="field1" value="Hello World!"; Field2: input type="text" id="field2" button onclick="myFunction()"Copy Textbutton>

A function is triggered when the button is clicked. The function copies the text from Field1 into Field2.
This is where you should have your image source as well.
Hello world example

Ready to launch your UI/UX career? Enroll in our UI Design Course today!

This brings us to the end of this article. You may check out the Web Development Certification Training by Edureka. Web Development Certification Training will help you learn how to create impressive websites using HTML5, CSS3, Twitter Bootstrap 3, jQuery and Google APIs and deploy it to Amazon Simple Storage Service(S3).

Check out the Angular Certification Training by Edureka, a trusted online learning company with a network of more than 250,000 satisfied learners spread across the globe. Angular is a JavaScript framework that is used to create scalable, enterprise, and performance client-side web applications. With Angular framework adoption being high, performance management of the application is community-driven indirectly driving better job opportunities.

If you want to get trained in React and wish to develop interesting UI’s on your own, then check out the React JS Certification Course by Edureka, a trusted online learning company with a network of more than 250,000 satisfied learners spread across the globe.

Got a question for us? Please mention it in the comments section of  article and we will get back to you.

Upcoming Batches For UI UX Design Certification Course
Course NameDateDetails
UI UX Design Certification Course

Class Starts on 24th August,2024

24th August

SAT&SUN (Weekend Batch)
View Details

Join the discussion

Browse Categories

webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP

Subscribe to our Newsletter, and get personalized recommendations.

image not found!
image not found!

How To Best Utilize Onclick In JavaScript?