Computer >> Computer tutorials >  >> Programming >> HTML

HTML DOM Input Number defaultValue Property


The HTML DOM input number defaultValue property returns and modify the default value of input field of type=”number” in a HTML document.

Syntax

Following is the syntax minus;

  • Returning default value

object.defaultValue
  • modifying default value

object.defaultValue=”number”

Example

Let us see an example of HTML DOM input number defaultValue property−

<!DOCTYPE html>
<html>
<head>
<style>
   html{
      height:100%;
   }
   body{
      text-align:center;
      color:#fff;
      background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
      height:100%;
   }
   p{
      font-weight:700;
      font-size:1.2rem;
   }
   input{
      width:35%;
      border:2px solid #fff;
      background-color:transparent;
      color:#fff;
      font-weight:bold;
      padding:8px;
   }
   .btn{
      background:#0197F6;
      border:none;
      height:2rem;
      border-radius:2px;
      width:35%;
      margin:2rem auto;
      display:block;
      color:#fff;
      outline:none;
      cursor:pointer;
   }
   .show{
      font-size:1.5rem;
      font-weight:bold;
   }
</style>
</head>
<body>
<h1>DOM Input number defaultValue Example</h1>
<p>Hi, Enter your day of birth</p>
<input type="number" class="numberInput">
<button onclick="changeValue()" class="btn">Submit</button>
<div class="show"></div>
<script>
   function changeValue() {
      var numberInput = document.querySelector(".numberInput");
      var showMsg = document.querySelector(".show");
      numberInput.defaultValue = "20";
      numberInput.value= numberInput.defaultValue;
      showMsg.innerHTML ="Tada! I changed your day of birth into mine!";
   }
</script>
</body>
</html>

Output

This will produce the following result −

HTML DOM Input Number defaultValue Property

Enter your day of birth and then click on “Submit” button to change your value into default value.

HTML DOM Input Number defaultValue Property


HTML DOM Input Number defaultValue Property