Iframe without src but still has content?
Yes, Here is how you change the html of the iframe with jQuery
var context = $('iframe')[0].contentWindow.document,
$body = $('body', context);
$body.html('Cool');
Demo: http://jsfiddle.net/yBmBa/
document.contentWindow: https://developer.mozilla.org/en-US/d...
Yes, it is possible to load an empty <iframe>
(with no src
specified) and later apply content to it using script.
See: http://api.jquery.com/jquery-wp-content/themes/jquery/js/main.js (line 54 and below).
Or simply try:
<iframe></iframe>
<script>
document.querySelector('iframe')
.contentDocument.write("<h1>Injected from parent frame</h1>")
</script>
Looks like this is the most compatible solution across browsers and also it is recognized by the W3C
<iframe src="about:blank"></iframe>
Sure. You can get a reference to the iframe
's document
object with
var doc = iframe.contentDocument;
and then you can create and add elements like you do in the current document.
If the iframe doesn't have a src
attribute, it will still contain an empty document. I believe though that at least older IE versions require the src
attribute to be set, otherwise the iframe won't have a document.
See also: contentDocument for an iframe.