Javascript Reference - HTML DOM Input Hidden Object

The Input Hidden object represents an HTML <input> element with type="hidden".

Example

We can access an <input> element with type="hidden" by using getElementById().


<!DOCTYPE html>
<html>
<body>
<input type="hidden" id="myInput" value="example">
<button onclick="myFunction()">test</button>
<p id="demo"></p>
<!--from  ww w .j  a  v  a 2 s  .c o  m-->
<script>
function myFunction() {
    var x = document.getElementById("myInput").value;
    document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

The code above is rendered as follows:

Example 2

We can create an <input> element with type="hidden" by using the document.createElement() method.


<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">test</button>
<p id="demo"></p>
<!--from  ww w .  j a  v  a 2s. com-->
<script>
function myFunction() {
    var x = document.createElement("INPUT");
    x.setAttribute("type", "hidden");
    document.body.appendChild(x);

    document.getElementById("demo").innerHTML = "created";
}
</script>

</body>
</html>

The code above is rendered as follows:

Input Hidden Object Properties

Property	Description
defaultValue	Sets or gets the default value of the hidden input field
form	Get the form that contains the hidden input field
name	Sets or gets the name attribute of the hidden input field
type	Get type string of a hidden input field
value	Sets or gets the value attribute of the hidden input field

Standard Properties and Events

The Input Hidden object supports the standard properties and events.