HTML DOM Input Button type Property


The HTML DOM input button type property returns the type of the input button i.e. whether it is of “button”, “submit” or “reset” type.

Syntax

Following is the syntax −

object.type

Example

Let us see an example of input button type property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<title>HTML DOM type Property</title>
<style>
   body{
      text-align:center;
   }
   .btn{
      display:block;
      margin:1rem auto;
      background-color:#db133a;
      color:#fff;
      border:1px solid #db133a;
      padding:0.5rem;
      border-radius:50px;
      width:40%;
   }
   .show-type{
      font-weight:bold;
      font-size:1.4rem;
      color:#ffc107;
   }
</style>
</head>
<body>
<h1>type Property Example</h1>
<input type = "submit" onclick = "getType()" class = "btn" value = "Click me to know about my type">
<div class="show-type"></div>
<script>
   function getType() {
      var btnType = document.querySelector(".btn").type;
      document.querySelector(".show-type").innerHTML = btnType;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Click on “Click me to know about my type” button to display the type of the input button.

karthikeya Boyini
karthikeya Boyini

I love programming (: That's all I know

Updated on: 30-Jul-2019

88 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements