lördag 31 maj 2014

Skapa iframeinnehåll dynamiskt med Javascript

Denna kodsnutt visar på hur man på ett enkelt sätt kan skapa en iframe med javascript, som i sin tur skapar upp HTML-dokumentet som ska visas i iframen istället för att länka till en befintlig sida.
Visar dessutom hur man t.ex. kan lägga till en scripttagg i den skapade iframesidan.
 <div id="my-iframe-container"></div>  
 <script>  
 var iframe = document.createElement('iframe');  
 iframe.width = '539px';  
 iframe.height = '380px';  
 iframe.scrolling = 'no';  
 var html = "<!DOCTYPE html>\n<head>\n<title>Test</title>\n</head>\n<body>\n";  
 html += "<div>Hello World!</div>";  
 html += "\n</body>\n</html>";  
 document.getElementById('my-iframe-container').appendChild(iframe);  
 iframe.contentWindow.document.open();  
 iframe.contentWindow.document.write(html);  
 iframe.contentWindow.document.close();  
 var headTag = iframe.contentWindow.document.getElementsByTagName('head')[0];  
 var s1 = iframe.contentWindow.document.createElement("script");  
 s1.type = "text/javascript";  
 s1.charset = 'UTF-8';  
 s1.async = true;  
 s1.id = 'another-script';  
 s1.src = 'http://mydomain.com/another.js';  
 headTag.appendChild(s1);  
 </script>  

Inga kommentarer:

Skicka en kommentar