HTML | DOM Input Image Object Last Updated : 26 Aug, 2022 Summarize Comments Improve Suggest changes Share Like Article Like Report The Input Image Object in HTML DOM is used to represent the HTML < input > element with type=”image”. This tag is used to access or create the element. This element can be accessed by using getElementById() method. Syntax: document.getElementById("MyImage"); Return Value: It return the properties of < input > tag with type="image". Property Values: ValueDescriptionaltSet/return the value of the alt attribute of the input image.autofocusSet/return if an input image automatically gets focus when the page loads.defaultValueSet/return the default value of an input image.disabledSet/return whether an input image is disabled, or not.formReturns a reference of the form that contains the input image.formActionSet/return the value of the formaction attribute of an input image.formEnctypeSet/return the value of the formenctype attribute of an input image.formMethodSet/return the value of the formmethod attribute of an input image.formNoValidateSet/return if the form-data is validated or not when submitted.formTargetSet/return the value of formtarget attribute of an input image.heightSet/return the value of height attribute of input image.nameSet/return the value of name attribute of input image.srcSet/return the value of src attribute of input image.typeReturn the type of form element of input element.valueSet/return the value of value attribute of input image.widthSet/return the value of width attribute of input image. Example-1: Access Input element and return ID, type and width. HTML <!DOCTYPE html> <html> <head> <title> HTML DOM Input Image Object </title> </head> <body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h2>DOM Input Image Object</h2> <button onclick="my_geek()"> <input id="myImage" type="image" src="https://media.geeksforgeeks.org/wp-content/uploads/gfg-40.png" alt="Submit" width="48" height="48"> </button> <h2 id="Geek_h" style="color:green;"> </h2> <script> function my_geek() { // Access myImage and return id var txt = document.getElementById( "myImage").id; txt = "id = " + txt + ", "; // Return type txt += "type = " + document.getElementById( "myImage").type + ", "; // Return Width txt += "width = " + document.getElementById( "myImage").width; document.getElementById( "Geek_h").innerHTML = txt; } </script> </body> </html> Output Before click on the button: After click on the button: Example-2: Access Input element and return target, alt and height. HTML <!DOCTYPE html> <html> <head> <title> HTML DOM Input Image Object </title> </head> <body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h2>DOM Input Image Object</h2> <button onclick="my_geek()"> <input id="myImage" type="image" formtarget="#" src="https://media.geeksforgeeks.org/wp-content/uploads/gfg-40.png" alt="Submit" width="48" height="48"> </button> <h2 id="Geek_h" style="color:green;"> </h2> <script> function my_geek() { // Return target, alt and height. var txt = document.getElementById( "myImage").formTarget; txt = "formTarget = " + txt + ", "; txt += "alt = " + document.getElementById( "myImage").alt + ", "; txt += "height = " + document.getElementById( "myImage").height; document.getElementById( "Geek_h").innerHTML = txt; } </script> </body> </html> Output Before click on the button: After click on the button: Example-3: Access Input element and return formTarget, formEnctype and formAction. HTML <!DOCTYPE html> <html> <head> <title> HTML DOM Input Image Object </title> </head> <body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h2>DOM Input Image Object</h2> <button onclick="my_geek()"> <input id="myImage" 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").formTarget; txt = "formTarget = " + txt + ", "; txt += "formEnctype = " + document.getElementById( "myImage").formEnctype + ", "; txt += "formAction = " + document.getElementById( "myImage").formAction; document.getElementById( "Geek_h").innerHTML = txt; } </script> </body> </html> Output Before click on the button: After click on the button: Supported Browsers: Google ChromeMozilla FirefoxEdge 12+SafariOpera Comment More infoAdvertise with us Next Article HTML DOM Location hash Property P PranchalKatiyar Follow Improve Article Tags : Web Technologies HTML HTML-DOM Similar Reads HTML DOM History forward() Method The History forward() method in HTML is used to load the next URL in the history list. It has the same practical application as the forward button in web browsers. This method will not work if the next page will not exist in the history list. Syntax: history.forwardExample: Below program illustrates 1 min read HTML DOM console log() Method The console.log() method in HTML is used for writing a message in the console. It indicates an important message during the testing of any program. The message is sent as a parameter to the console.log() method. Syntaxconsole.log( message )ParametersParameterDescriptionmessageIt is mandatory and use 2 min read HTML DOM Location hash Property The Location Hash property in HTML is used to return the anchor part of a URL. It can also be used to set the anchor part of the URL. It returns the string which represents the anchor part of a URL including the hash '#' sign. Syntax: It returns the hash property.location.hashIt is used to set the h 2 min read HTML DOM History length Property The History length property in HTML is used to return the count of URLs in the history list of the current browser window. The minimum value returned by this property is 1 because the current page is loaded at the moment whereas the maximum count that can be displayed is 50. Web browsers such as Int 1 min read HTML DOM History back() Method The History back() method in HTML is used to load the previous URL in the history list. It has the same practical application as the back button in our web browsers. This method will not work if the previous page does not exist. This method does not contain any parameter.Syntax: history.back Below p 1 min read HTML DOM History go() Method The History go() method in HTML is used for loading a specific URL from the history list. It is a better alternative to history.back() and history.forward() methods if a number or the URL of the specific page is known and wants to load from your history. Syntax: history.go( number|URL )Parameters: T 2 min read HTML DOM console groupEnd() Method The console.groupEnd() method in HTML is used to indicate the end of a group of messages in the console that has been created using the console.group() method. This method does not accept any parameter. Syntax:console.groupEnd()Example: The below program illustrates the console.groupEnd() method in 2 min read HTML DOM readyState Property The readyState property in HTML is used to return the loading status of the current document. This property is used for read-only. Syntax:document.readyStateReturn Value: It returns a string value which is used to define the status of the current document. The one of five status are listed below:uni 2 min read HTML DOM Location host Property The Location Host property in HTML is used to sets or return the hostname and port of a URL. The Location Hash property doesn't return the port number if it is not specified in the URL. Syntax: It returns the host property. location.hostIt is used to set the host property. location.host = hostname:p 1 min read HTML DOM Location protocol Property The Location protocol property in HTML is used to return the protocol or set the protocol of the current URL. It returns a string that contains the protocol of the current URL, including the colon (:). Syntax: It returns the protocol property. location.protocolIt is used to set the protocol property 1 min read Like