Skip to content
Related Articles

Related Articles

HTML | DOM IFrame srcdoc Property
  • Last Updated : 26 Jul, 2019

The HTML DOM IFrame srcdoc property is used to set or return the value of a srcdoc attribute of an <Iframe> element. The srcdoc attribute is used to specify the HTML content of the document in the <Iframe> element. It can be used together with the sandbox and seamless attributes.

Syntax:

  • It returns the srcdoc property.
    iframeObject.srcdoc
  • It is used to set the srcdoc property.
    iframeObject.srcdoc = HTML_code

    Property Values:

    • HTML_code: It is used to specify the HTML content of the page which will display in an Iframe element.

    Return Value: It returns a string value which specify the HTML content of the page that are display in the Iframe element.

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






    <!DOCTYPE html> 
    <html
      
    <head
        <title
            HTML DOM iframe srcdoc Property 
        </title
    </head
      
    <body style="text-align:center;"
          
        <h1>GeeksforGeeks</h1
          
        <h2>HTML DOM iframe srcdoc Property</h2
          
                srcdoc="<p>GeeksForGeeks</p>" id="GFG"
                height="200" width="400" name="myGeeks">
        </iframe
          
        <br><br>
          
        <button onclick="Geeks()">Submit</button>
          
        <p id="sudo" style="font-size:20px"></p>         
          
        <script>
            function Geeks() {
                var x = document.getElementById("GFG").srcdoc;
                document.getElementById("sudo").innerHTML = x;
            }
        </script>
    </body
      
    </html>

    Output:

    • Before Clicking on Button:
    • After Clicking on Button:

    Example 2: This example illustrates how to set the Iframe srcdoc property.




    <!DOCTYPE html> 
    <html
      
    <head
        <title
            HTML DOM iframe srcdoc Property 
        </title
    </head
      
    <body style="text-align:center;"
          
        <h1>GeeksforGeeks</h1
          
        <h2>HTML DOM iframe srcdoc Property</h2
          
                srcdoc="<p>GeeksForGeeks</p>" id="GFG"
                height="200" width="400" name="myGeeks">
        </iframe
          
        <br><br>
          
        <button onclick="Geeks()">Submit</button>
          
        <p id="sudo" style="font-size:20px"></p>         
          
        <script>
            function Geeks() {
                var x = document.getElementById("GFG").srcdoc
                        = "Hello Geeks";
                document.getElementById("sudo").innerHTML
                        = "The value of the srcdoc attribute "
                        + "was changed to " + x;
            }
        </script>
    </body
      
    </html>

    Output:

    • Before Clicking on Button:
    • After Clcking on Button:

    Supported Browsers: The browsers supported by HTML DOM IFrame srcdoc Property are listed below:

    • Google Chrome 20.0
    • Firefox 25.0
    • Safari 6.0
    • Opera 15.0

    full-stack-img

    My Personal Notes arrow_drop_up
Recommended Articles
Page :