Only load HTML into an IFRAME

Question

How can I only load the HTML of a page into an IFRAME, without automatically triggering the download of all the css,scripts,images,videos on the page?

Or can you get an event the moment the DOM is "ready".. when the initial HTML has loaded and nothing much more.

Answer 1

There is no cross-browser way to do this. Some browsers provide events that fire when the DOM loads, like DOMContentLoaded for Gecko.

jQuery implements this functionality. I suggest you either use jQuery for this:

$(document).ready(function () {
  // Function is called when the DOM is loaded.
});

Or check how jQuery implements it. See the bindReady function in the jQuery source code.

Answer 2

The short answer is "You can't".

Internet Explorer supports a propriatry attribute which can prevent scripts from executing, but it isn't cross browser and doesn't deal with images or stylesheets.

A number of JS libraries implement a custom event that fires when the DOM is ready - but browsers load resources in parallel, so while that event may fire before all images and stylesheets are loaded, it is unlikely to fire before the other elements start to download.

If you really want the page to load without those things - process it on the server to strip out the HTML that includes them.

Answer 3

To get only the HTML contents, try using an AJAX call. That would, of course, return the content in a variable, but you might process it as you see fit afterward.

Answer 4

Set 'Content-type' for that HTML page to text/plain.