All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

HTML Button Onclick Link

Last Updated : Mar 11, 2024

HTML Button Onclick Link

In this tutorial we will show you the solution of HTML button onclick link, sometimes in HTML we see a button on browser in which we click on the button and the next webpage opens. In the way, we want to say that sometimes there is a form like admission form or login form.

After you fill the information you see a button there with value save or submit. And when you click on the button the button opens a page where you have to confirm that the information filled by you is right or not. And then you submit it.

Hence, here we want to say that html button used as a link. So, today our topic is about how to make a html button on click as link.

Step By Step Guide On HTML Button Onclick Link :-

As here, we have to show you that how you are able to make a button which acts as a link on click. You can use here two type of buttons, first one is like by using button tag and other one is by using input tag.

Here we show you both concepts. So, that you get never confused. Mostly both are same when you see them on browser screen, but in codes there is too much difference.

A general use of button tag as a link on click with the help of codes is given here...

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document<title>
        </head>
          <body>
       <button>
        <a href="demo2.html">
            Click me!
        </a>
    </button>
    <br><br>
    <button type="submit">
        <a href="demo3.html">
            Click me too!
        </a>
    </button>
          </body>
      </html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here. Hence, as showed we create two buttons. The first one is using button tag and other one is also using button tag. In both of them, we create one anchor tag.
  5. The anchor tag used here is used to make button, a link. After this we given value to anchor tag attribute. And the text that is showed on browsers screen is also written in this tag. And this in next article we show you how you are able to make button a link with the help of input tag.
  6. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

At last, in conclusion we want to say that now we are able to make html button as a link. Now, if you have seen on article on forms then there is an assignment for you.

You have to make a button on click acts as link with the help of input type button, later we also discuss on this, if you don’t know. I hope this tutorial on HTML button onclick link helps you.

Author Image About Ashish

Ashish is a dynamic and motivated individual with a passion of programming and an experienced programmer having 3+ years of experience in various languages like Java, Python, HTML, CSS, JavaScript, jQuery and various frameworks like Bootstrap

Follow Ashish On Linkedin 🡪