Insert iframe into site without using document.write

Question

Our website uses an iframe to display a library of products we offer, and recently the iframe stopped loading in Google Chrome, because they stopped supporting document.write. We need a solution to show the page the same way we have been, but without using document.write. I am a novice, and have tried several solutions but nothing has worked.

what we have:

<script language="JavaScript">
<!--
var ss='<span style="font-size: small;"><b>NOTICE:</b> If you are having 
trouble finding a pattern, try searching the first three letters of the 
pattern name in the search bar. Also, be aware that some sheers may be 
photographed with a window pane to show sheer quality.<br>If you are using 
Google Chrome and have an issue viewing the library, please switch to another 
browser.</span><br><br>'; 
var upper_limit = 500000000;

//-->
document.write(ss);
  function getIP(json) {

        document.write('<iframe frameborder="0" marginheight="0" width="100%" 
height="700" src=" ' + 'http://client.richloomfabrics.com/cgi-bin/Wdrv01?
&amp;PARPAR=CON&amp;MELMEL=ALL&amp;PTYPTY=UPH&amp;IPAIPA=' + json.ip + 
'&amp;IPACOK=' + RandomNumber(upper_limit) + '&amp;PGMPGM=WC033&amp;>
</iframe>');

          }
</script>
<script type="application/javascript" src="https://api.ipify.org?
format=jsonp&callback=getIP"></script>

We use a shopping cart, which is why we need the random number and IP. I have tried a few solutions I've seen but don't know enough about this to properly edit. Can anyone send me in the right direction?

Answer 1

In a very simple case you can just use innerHTML property of body , something like this

<script language="JavaScript">
<!--
var ss='<span style="font-size: small;"><b>NOTICE:</b> If you are having 
trouble finding a pattern, try searching the first three letters of the 
pattern name in the search bar. Also, be aware that some sheers may be 
photographed with a window pane to show sheer quality.<br>If you are using 
Google Chrome and have an issue viewing the library, please switch to another 
browser.</span><br><br>'; 
var upper_limit = 500000000;

//-->
document.body.innerHTML += ss;
  function getIP(json) {

        document.body.innerHTML += '<iframe frameborder="0" marginheight="0" width="100%" 
height="700" src=" ' + 'http://client.richloomfabrics.com/cgi-bin/Wdrv01?
&amp;PARPAR=CON&amp;MELMEL=ALL&amp;PTYPTY=UPH&amp;IPAIPA=' + json.ip + 
'&amp;IPACOK=' + RandomNumber(upper_limit) + '&amp;PGMPGM=WC033&amp;>
</iframe>';

          }
</script>
<script type="application/javascript" src="https://api.ipify.org?
format=jsonp&callback=getIP"></script>

Answer 2

You can also use appendChild

var iframeElem = document.createElement('iframe');
iframeElem.src = 'https://www.google.com';
document.body.appendChild(iframeElem);