Skip to main content
replaced http://stackoverflow.com/ with https://stackoverflow.com/
Source Link
URL Rewriter Bot
URL Rewriter Bot

One of the answers in How do I get the entire page's HTML with jQuery? suggests that in order to retrieve the <!DOCTYPE> information, you need to construct this declaration manually, by retrieving the <iframe>'s document.doctype property and then adding all of the attributes to the <!DOCTYPE> declaration yourself. Is this really the only way to retrieve this information from the <iframe>'s HTML page source?

One of the answers in How do I get the entire page's HTML with jQuery? suggests that in order to retrieve the <!DOCTYPE> information, you need to construct this declaration manually, by retrieving the <iframe>'s document.doctype property and then adding all of the attributes to the <!DOCTYPE> declaration yourself. Is this really the only way to retrieve this information from the <iframe>'s HTML page source?

Added note about other declarations/other tags.
Source Link
Aiias
  • 4.7k
  • 1
  • 20
  • 34

Summary

As you can see, Google Chrome's Inspect element shows that within the <iframe> the <!DOCTYPE> declaration is present, so how can I retrieve this data with the page source? This question also applies to any other declarations or other tags that are not contained within the <html> tags.

As you can see, Google Chrome's Inspect element shows that within the <iframe> the <!DOCTYPE> declaration is present, so how can I retrieve this data with the page source?

Summary

As you can see, Google Chrome's Inspect element shows that within the <iframe> the <!DOCTYPE> declaration is present, so how can I retrieve this data with the page source? This question also applies to any other declarations or other tags that are not contained within the <html> tags.

Source Link
Aiias
  • 4.7k
  • 1
  • 20
  • 34

Is it possible to retrieve the *full* HTML page source of an iframe with Javascript?

I am trying to figure out how to retrieve the full (that means all data) HTML page source from an <iframe> whose src is from the same originating domain as the page that it is embedded on. I want the exact source code at any given time, which could be dynamic due to Javascript or php generating the <iframe> html output. This means AJAX calls like $.get() will not work for me as the page could have been modified via Javascript or generated uniquely based on the request time or mt_rand() in php. I have not been able to retrieve the exact <!DOCTYPE> declaration from my <iframe>.

I have been experimenting around and searching through Stack Overflow and have not found a solution that retrieves all of the page source including the <!DOCTYPE> declaration.

One of the answers in How do I get the entire page's HTML with jQuery? suggests that in order to retrieve the <!DOCTYPE> information, you need to construct this declaration manually, by retrieving the <iframe>'s document.doctype property and then adding all of the attributes to the <!DOCTYPE> declaration yourself. Is this really the only way to retrieve this information from the <iframe>'s HTML page source?

Here are some notable Stack Overflow posts that I have looked through and that this is not a duplicate of:

Here is some of my local test code that illustrates my best attempt so far, which only retrieves the data within and including the <iframe>'s <html> tag:

main.html

<html> <head> <title>Testing with iframe</title> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript"> function test() { var doc = document.getElementById('iframe-source').contentWindow.document; var html = $('html', doc).clone().wrap('<p>').parent().html(); $('#output').val(html); } </script> </head> <body> <textarea id="output"></textarea> <iframe id="iframe-source" src="iframe.html" onload="javascript:test()"></iframe> </body> </html> 

**iframe.html**
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html class="html-tag-class"> <head class="head-tag-class"> <title>iframe Testing</title> </head> <body class="body-tag-class"> <h2>Testing header tag</h2> <p>This is <strong>very</strong> exciting</p> </body> </html> 

And here is a **screenshot** of these files run together in Google Chrome version 27.0.1453.110 m: ![iframe testing][1]

As you can see, Google Chrome's Inspect element shows that within the <iframe> the <!DOCTYPE> declaration is present, so how can I retrieve this data with the page source?


Any help or advice on retrieving this full page source code via Javascript would be greatly appreciated. [1]: https://i.sstatic.net/y1LEk.png