javascript function

Hello Friends,

In this tutorial we will learn about 2 methods to call a javascript function on button click. So let’s start with the coding,

javascript function  we have to create one button using HTML :

<!DOCTYPE html>
 <html lang="en" dir="ltr">
  <head>
   <meta charset="utf-8">
   <title>Javascript Button</title>
  </head>
  <body>
   <button>CLick Me</button>
  </body>
 </html>

In the above code I have create new button to make it functional with using javascript.

Now we have to decide what to do with this button. So I am going to show alert box on this button click.

Now I am going to do this using first method by calling function with onclick method:

<script>
 function clickme(){
   alert('Hello There');
 }
</script>

In the above code I have created new function to be called on button click. To do so i am using onclick javascript method as shown in the code below :

<button onclick="clickme();">Click</button>

This method will call clickme function whenever we click on button.

Now it’s time to use another method for the same functionality using id (Javascript call function on click)

<button id="abcd">CLick Me</button>
  <script>
    document.getElementById('abcd').onclick = function(){
     alert('peeter');
    };
 </script>

In the above code I have used document.getElementById to select button and use onclick method with it to create new function.

So That’s all for today hope you guys understand these two onclick methods.

167 thoughts on “javascript function

Leave a Reply

Your email address will not be published. Required fields are marked *

  1. “I wanted to put you one very small note in order to say thank you again for your personal unique advice you have provided on this site. It’s quite pretty generous with you to make openly just what a few people would have marketed as an ebook to make some bucks on their own, precisely given that you could possibly have tried it in case you considered necessary. Those points as well acted to become fantastic way to fully grasp other people have similar interest similar to my personal own to realize more with respect to this issue. I’m sure there are several more pleasant instances in the future for individuals who take a look at your site.”

Please wait...

Subscribe to our newsletter

Want to be notified when our article is published? Enter your email address and name below to be the first to know.