Skip to content
Related Articles

Related Articles

Improve Article
HTML | DOM Input Text value Property
  • Difficulty Level : Basic
  • Last Updated : 14 May, 2021

The Input Text value property in HTML DOM is used to set or return the value of a value attribute of the input field. The value attribute specifies the initial value of the input Text Field. It contains the default value or the user types.
Syntax: 
 

  • It returns the Input Text value property. 
     
textObject.value
  • It is used to set the Input Text value property. 
     
textObject.value = text

Property Value: It contains single value text which defines the value of the input text field.
Return Value: It returns the string value which represent the value of the Text Field.
Example 1: This example illustrates how to return Input Text value property. 
 

html




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Input Text value Property
    </title>
</head>
 
<body style="text-align:center;">
 
    <h1>GeeksForGeeks</h1>
 
    <h2>DOM Input Text value Property</h2>
 
    <input type="text" id="text_id" value="Hello Geeks!">
     
  
     
    <button onclick="myGeeks()">Click Here!</button>
     
    <p id="GFG"></p>
  
     
    <!-- Script to return the Input Text value Property-->
    <script>
        function myGeeks() {
            var txt = document.getElementById("text_id").value;
            document.getElementById("GFG").innerHTML = txt;
        }
    </script>
</body>
 
</html>                    

Output:
Before Clicking On Button: 
 

After Clicking On Button: 



 

Example 2: This example illustrates how to set Input Text value property. 
 

html




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Input Text value Property
    </title>
</head>
 
<body style="text-align:center;">
 
    <h1>GeeksForGeeks</h1>
 
    <h2>DOM Input Text value Property</h2>
 
    <input type="text" id="text_id" value="Hello Geeks!">
     
 
     
    <button onclick="myGeeks()">Click Here!</button>
     
    <p id="GFG" style="font-size:20px;"></p>
  
     
    <!-- Script to set Input Text value Property-->
    <script>
        function myGeeks() {
            var txt = document.getElementById("text_id").value
                    = "GeeksForGeeks";
                     
            document.getElementById("GFG").innerHTML
                    = "The value of the value attribute "
                      + "was changed to : " + txt;
        }
    </script>
</body>
 
</html>                   

Output: 
Before Clicking the Button: 
 

After Clicking the Button: 
 

Supported Browsers: The browser supported by DOM input Text value property are listed below: 
 

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Safari

 




My Personal Notes arrow_drop_up