Skip to content
Related Articles

Related Articles

Improve Article

HTML | DOM Input Image alt Property

  • Last Updated : 23 Aug, 2019

The HTML DOM Input Image alt Property is used set or return the value of the alt attribute of an Input Image. The alt Attribute is used to specify the alternate text for an image. It is useful when the image not displayed. It is used to give alternative information for an image.

Syntax:

  • It returns the alt property.
    imageObject.alt 
  • It is used to Set the alt property.
    imageObject.alt = text 

    Property value: It contains the value i.e. text which specify alternative text for an input Image.

    Return value: It returns a string value which represents an alternative text for an Input Image.

    Example 1: This Example returns the alt property.






    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            HTML DOM Input Image alt Property
        </title>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;"
          GeeksforGeeks 
        </h1>
      
        <h4>
          DOM Input Image alt Property
        </h4>
        <input id="myImage" formEnctype="application/x-www-form-urlencoded" 
               type="image" formtarget="#" src=
               alt="Geeks_Logo" width="48" height="48" formMethod="post" 
               autofocus>
        <br>
        <br>
        <button onclick="my_geek()">Submit </button>
      
        <h2 id="Geek_h" style="color:green;"></h2>
        <script>
            function my_geek() {
      
                // set Disabled Property. 
                var txt = document.getElementById(
                    "myImage").alt;
                document.getElementById(
                    "Geek_h").innerHTML = txt;
            }
        </script>
    </body>
      
    </html>

    Output:

    • Before Clicking On Button:
    • After Clicking On Button:

    Example 2: This Example sets the alt Property.




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            HTML DOM Input Image alt Property
        </title>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;"
          GeeksforGeeks 
        </h1>
      
        <h4>
          DOM Input Image alt Property
        </h4>
        <input id="myImage" formEnctype="application/x-www-form-urlencoded" 
               type="image" formtarget="#" src=
               alt="Geeks_Logo" width="48" height="48" formMethod="post"
               autofocus>
        <br>
        <br>
        <button onclick="my_geek()">Submit </button>
      
        <h2 id="Geek_h" style="color:green;"
      
            </h2>
        <script>
            function my_geek() {
      
                // set Disabled Property. 
                var txt = document.getElementById(
                    "myImage").alt = "submit";
                document.getElementById(
                        "Geek_h").innerHTML =
                    "The alt Attribute was changed to " + txt;
            }
        </script>
    </body>
      
    </html>

    Output:

    • Before Clicking On Button:
    • After Clicking On Button:

    Supported Browsers: The browsers supported by HTML DOM Input Image alt Property are listed below:

    • Googl Chrome 10.0
    • Firefox 4.0
    • Opera 11.0
    • Safari 5.1

    Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.




    My Personal Notes arrow_drop_up
  • Recommended Articles
    Page :