I try to add dynamically an iframe to a web page using JavaScript. I would like to know if that's possible to set the src attribute of my iframe without using another html file via an URL.
I mean is there a way to "fake" the html for the src attribute file with a JS variable where we I can set my code (which is JS itself) ?
I would use the DOM createElement to create the iframe in jQuery.
Thanks !
You could look into data:
URIs.
<iframe src="data:text/html, .... URLencoded HTML data ....">
alternatively
<iframe src="data:text/html;base64, .... base64 encoded HTML data ....">
The scheme is supported by IE >= 8 (MSDN source), Firefox, Safari 3+ and Opera.
It has differing length limits. Opera is said to cut off at about 4 kilobytes; Internet Explorer at 32 kilobytes. Firefox has no explicit length limit.
More on data URIs and tools for converting at Mozilla Developer Central
If you're controlling the iframe entirely client-side, and never need to make server-side requests with that iframe, it's proably easier to style a div to appear like an iframe (look into the overflow
property), where you'll have far simpler and more direct control to the DOM contents of that div.
following code should do what you want.
you can leave the src attribute empty.
var yourcontent="<div>your stuff</div>";
window.frames['frame_name'].document.write=yourcontent;