Netscape 4 and Internet Explorer 4 each introduced their own proprietary document object model (DOM) that allowed scripts to interact far more easily with the web page without needing to use document.write at all. Unfortunately these DOM were incompatible with one another butr this was resolved by all subsequent browsers incorporating at least the first portion of the W3C standard DOM. As all browsers to not support the standard DOM died out by approximately 2005 there has been no reason to use either document.write or either of the proprietary DOM since that time. The DOM are a little complicated for a beginner to understand and so browsers soon introduced another simpler way to interface with web pages called innerHTML. While there are a few limitations on where you can use innerHTML they are far fewer than the restrictions on using document.write and so if none of the prior replacements for document.write could be considered to have made document.write completely obsolete then the introduction of innerHTML certainly did.
Where you have document.write statements in your own script you can easily rewrite the script to use innerHTML instead. Simply place a div with an id in the place where you had the script and move the script itself to the bottom of the page. Declare a new variable at the top of the script to hold the values to be written out and replace all of the document.write statements with commands to concatenate to that variable instead. Then at the end of the script simply use document.getElementById to reference the div you added and innerHTML to insert the values that the document.write statements were outputting.
For example if your original script reads:
Then you'd place the following HTML in plave of that script:
and move the script to the bottom of the page and change it to read:
This conversion can be applied no matter what document.write statements you have in the original obsolete code, you simply need to specify a different id for each spot where something needs to be output.
A number of people have collaborated on finding a solution to this problem and the result is a script called postscribe. Using this script you can take any script that contains document.write statements and attach it to the bottom of your web page. The only restrction on using this to move scripts to the bottom of the web page that I have found is that you can't combine the scripts together if they are supposed to be outputting to different spots in the page.
Note that the only change we have made is to incorporate the call to the Google script into the same script as the one assigning the parameters for it to use with that script tag as the second parameter to a postscribe call and with the id where we want the ad to be inserted defined in the first parameter. The code in the second parameter needs to coded in the same way as if we were using a document.write statement and so the </script> in the code needs to be escaped so that it is treated as data and not as the HTML tag at the end of the script.
Let's assume that code is in a script that we call ad1.js. So now we just need copies of the htmlParser.js and postscribe.js files which we can get from GIThub and by including calls to those two files at the bottom of our page we can then follow that with the call to our ad script.
To add a second Google ad we'd add a new div where we want the second ad to appear and create another script to contain the Google code for that ad with the postscribe call identifying where that ad is to appear and then add a call to that script after the ones we just added (we only need toe postscribe and htmlParser scripts to be included once and we need each ad script to be separate).
This article written by Stephen Chapman, Felgall Pty Ltd.