Over document.write()

Met de function document.write() kun je tekst en tags vanuit JavaScript naar een geopend HTML-document schrijven. Toepassingen waarvoor dat handig is, zijn eenvoudig te bedenken. Zo bevatten de ontwikkelversies van sommige pagina's van deze website informatie die ontbreekt als die pagina' s niet vanaf internet (dus direct vanuit Windows) worden geladen. Dat wordt geregeld door een JavaScriptje, dat kijkt of de string https:// in de URL voorkomt. Zo niet, dan wordt die informatie niet geschreven, anders wordt de informatie er in gezet met document.write().

Sinds langere tijd waarschuwt de browser FireFox ervoor dat gebruik van document.write() problemen kan geven bij het renderen van de pagina en dat gebruik van document.write() in de toekomst niet meer mogelijk zou zijn. Een poos later kwamen de Chromium-browsers met vergelijkbare meldingen.

Nader beschouwd is dat onzin. Er zijn miljoenen websites die document.write() gebruiken. Als een browser ineens allerlei websites niet meer wil / kan weergeven, zal dat er toe leiden dat de gebruikers en andere browser kiezen. Dat is slecht voor de reputatie (lees: het marktaandeel). Het is dan ook niet vreemd dat de melding na verloop van tijd werd aangepast tot het advies om gebruik van document.write() te vermijden.

Waar komt dit vandaan?
Vaak wordt document.write() gebruikt om HTML-tags mee te maken, zie bijvoorbeeld de de items HTML laten genereren door JavaScript en JavaScript debuggen.

• Meestal gaat dat goed, behalve als je <script>-tags gaat maken. Je kunt met document.write() geen scripts in een HTML-document zetten.
• Het gaat ook fout als je probeert om reeds gerenderde HTML wilt veranderen. Verschillende versies van browsermotoren geven verschillende resultaten. Het uiteindelijke resultaat is onvoorspelbaar.

Hoe kun je document.write() het beste gebruiken?
Je kunt document.write() probleemloos gebruiken als je je aan een paar eenvoudige regels houdt:

• Verstoor de volgorde van de rendering niet. Als je document.write() laat werken tijdens laden van de pagina werkt het zeker goed, mar grijp niet terug naar elementen die al gerenderd zijn of die (later in het laadproces) nog gerenderd gaan worden.
• Als de pagina eenmaal is geladen (lees: als het event load is afgevuurd) is het beter om document.write() niet meer te gebruiken. Let daarbij ook op functions die document.write() gebruiken en die kunnen worden uitgevoerd als de pagina is geladen.
• Schrijf geen <script>-tags uit met document.write(). Andere tags kunnen wel.
   
• Als de pagina eenmaal is geladen, moet je gebruiken:
  document.getElementById().innerHTML. De tekst / tags die veranderd moeten worden hebben dus een id.

Tenslotte:
Er wordt hier steeds gesproken over document.write(), dit kun je ook lezen als document.getElementById().write(). Dit zou je misschien willen gebruiken om de content van een tag met id="…" te veranderen, maar dat is nou juist waar het fout kan gaan …