Skip to content
Related Articles

Related Articles

How to get HTML content of an iFrame using JavaScript ?

Improve Article
Save Article
Like Article
  • Last Updated : 05 Jun, 2020

The <iframe> tag specifies an inline frame. It allows us to load a separate HTML file into an existing document.

Code snippet:

function getIframeContent(frameId) {
    var frameObj = 

    var frameContent = frameObj.
    alert("frame content : " + frameContent);

Some of the definitions are given below:

  • getIframeContent(frameId): It is used to get the object reference of an iframe.
  • contentWindow: It is a property which returns the window object of the iframe.
  • contentWindow.document: It returns the document object of iframe window.
  • contentWindow.document.body.innerHTML: It returns the HTML content of iframe body.

Example: The following example demonstrates to include separate HTML file into existing document.

<!DOCTYPE html>
        How to get HTML content of 
        an iFrame using javascript?
    <iframe id="frameID" src=
    <a href="#" onclick=
        Get the content of Iframe
        function getIframeContent(frameID) {
            var frameObj = 
            var frameContent = frameObj
            alert("frame content : " + frameContent);

ContentOfFrame.html The following example demonstrates the HTML code content of file “ContentOfFrame.html”

<!DOCTYPE html>
    GeeksForGeeks: A Computer 
    Science Portal For Geeks
    (It is loaded inside the 


  • Before clicking the link:
  • After clicking the link:

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!