HTML DOM Input Hidden type Property

HTMLWeb DevelopmentFront End Technology

The HTML DOM input hidden type property returns the value of type attribute of input field.

Syntax

Following is the syntax −

object.type

Example

Let us see an example of HTML DOM input hidden type property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      text-align:center;
      background-color:#F19A3E;
      color:#fff;
   }
   .btn{
      background-color:#3C787E;
      border:none;
      height:2rem;
      border-radius:50px;
      width:60%;
      margin:1rem auto;
      display:block;
      color:#fff;
      outline:none;
   }
   .show{
      color:#fff;
      font-size:1.2rem;
      font-weight:600;
   }
</style>
</head>
<body>
<h1>DOM Hidden type Property Demo</h1>
Enter your Name:<input type="hidden" class="input-field">
<button onclick="getType()" class="btn">Click to get above input type</button>
<div class="show"></div>
<script>
   function getType() {
      var inputField = document.querySelector(".input-field");
      var msgDiv = document.querySelector(".show");
      msgDiv.innerHTML = "type = " + inputField.type;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Click on “Click to get above input type” button to get the value of type attribute of hidden input field.

raja
Published on 17-Jul-2019 14:48:53
Advertisements