How to import external stylesheet and javascript into an iframe?

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

<iframe src="url_of_your_iframe_page.html"></iframe>

<script>
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link');
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = 'url_of_external_stylesheet.css';
head.appendChild(link);
</script>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

<iframe src="url_of_your_iframe_page.html"></iframe>

<script>
var iframe = document.querySelector('iframe');
iframe.addEventListener('load', function () {
    var script = iframe.contentWindow.document.createElement('script');
    script.src = 'url_of_external_script.js';
    iframe.contentWindow.document.head.appendChild(script);
});
</script>