HTML | DOM Input Number value Property


The DOM Input Number value Property in HTML DOM is used to set or return the value of a value attribute of the number field. The value attribute specifies the initial value of the input number Field. It contains the default value or the user types.

Syntax:

  • It returns the value property.
    numberObject.value
  • It is used to Set the value property.
    numberObject.value = number

Property Value: It contains single value text which defines the value of the input number field.

Return Value: It returns the string value which represent the value of the number Field.

Example-1: This example illustrates how to return the property.



filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
  
    <body style="text-align:center;"
  
        <h1 style="color:green;"
            GeeksForGeeks 
        </h1
  
        <h2>DOM Input Number value Property</h2
  
        <input type="number"
            id="myNumber"
            value="10"
  
        <p>Click the button to get the 
        number of the number field.</p
  
        <button onclick="myFunction()"
            Click Here! 
        </button
  
        <p id="demo"></p
  
        <script
            function myFunction() { 
                  
                // Accessing input value 
                var x = 
                document.getElementById("myNumber").value; 
                document.getElementById("demo").innerHTML = x; 
            
        </script
  
    </body
  
</html

chevron_right


Output:
Before Clicking On Button:

After Clicking On Button:

Example-2 : This Example illustrates how to set the Property.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
  
    <body style="text-align:center;"
  
        <h1 style="color:green;"
            GeeksForGeeks 
        </h1
  
        <h2>DOM Input Number value Property</h2
  
        <input type="number"
            id="myNumber"
            value="10"
  
        <p>Click the button to change the 
        number of the number field.</p
  
        <button onclick="myFunction()"
            Click Here! 
        </button
  
        <p id="demo"></p
  
        <script
            function myFunction() { 
                  
                // Accessing input value 
                var x = 
                document.getElementById("myNumber").valued  = "20"; 
                document.getElementById("demo").innerHTML = 
                "The value of number was changed to " + x; 
            
        </script
  
    </body
  
</html

chevron_right


Output :
Before Clicking On Button:

After Clicking On Button:

Supported Browsers: The browser supported by DOM input number value Property are listed below:

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

full-stack-img




My Personal Notes arrow_drop_up

Recommended Posts:

    Article Tags :
    Practice Tags :


    Be the First to upvote.


    Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.