HTML | DOM Input Image value Property - GeeksforGeeks

31 Mar, 2022
The Input Image value Property in HTML DOM is used to sets or returns the value of the value attribute of the Input Image.
Syntax:
It returns the value Property.imageObject.value
imageObject.value
It sets the value Property.imageObject.value = value;
imageObject.value = value;
Property Value It contains the value text Which specify the value of the input Image
Return Value It returns a string value that represents the value of the Input Image.
Example: This Example returns the Input Image value Property.
<!DOCTYPE html><html>  <head>    <title>        HTML DOM Input Image value Property    </title></head>  <body style="text-align:center;">      <h1 style="color:green;">             GeeksForGeeks         </h1>      <h2>DOM Input Image value Property</h2>    <button onclick="my_geek()">        <input id="myImage"               value="myGeeks"                type="image"                src="https://media.geeksforgeeks.org/wp-content/uploads/gfg-40.png"                alt="Submit"                formaction="#"               formtarget="#"                formenctype="text/plain"                width="48"               height="48">    </button>    <h2 id="Geek_h"        style="color:green;">           </h2>    <script>        function my_geek() {              // Return formTarget,            // formEnctype and formAction.             var txt = document.getElementById(                "myImage").value;            document.getElementById(                "Geek_h").innerHTML = txt;        }    </script></body>  </html>
Output:Before Clicking On Button:
After Clicking On Button:
Example-2: This Example sets the Input Image value Property.
<!DOCTYPE html><html>  <head>    <title>        HTML DOM Input Image value Property    </title></head>  <body style="text-align:center;">      <h1 style="color:green;">             GeeksForGeeks         </h1>      <h2>DOM Input Image value Property</h2>    <button onclick="my_geek()">        <input id="myImage"               value="myGeeks"                type="image"                src="https://media.geeksforgeeks.org/wp-content/uploads/gfg-40.png"                alt="Submit"                formaction="#"                formtarget="#"                formenctype="text/plain"                width="48"                height="48">    </button>    <h2 id="Geek_h"        style="color:green;">           </h2>    <script>        function my_geek() {              // Return formTarget,            // formEnctype and formAction.             var txt = document.getElementById(                "myImage").value = "Hello Geeks";                        document.getElementById(                "Geek_h").innerHTML =              "The value was changed to " + txt;        }    </script></body>  </html>
Output:Before Clicking On Button:
After Clicking On Button:
Supported Browsers: The browsers supported by DOM Input Image value Property are listed below:
Google Chrome
Internet Explorer
Firefox
Apple Safari
Opera
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.
chhabradhanvi
HTML-DOM
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Types of CSS (Cascading Style Sheet)
How to Insert Form Data into Database using PHP ?
REST API (Introduction)
Design a web page using HTML and CSS
Form validation using HTML and JavaScript
Top 10 Front End Developer Skills That You Need in 2022
Installation of Node.js on Linux
How to fetch data from an API in ReactJS ?
Difference between var, let and const keywords in JavaScript
Convert a string to an integer in JavaScript