+ 6

Does document.write work only when it wants to?

I was trying to understand how document.write and document.writeln is supposed to work in JavaScript, but I cant for the life of me. I made a new project and tried out some things. https://code.sololearn.com/WG7pfOozVics/#js ---------------------------- These are my doubts -> It is supposed to rewrite the document, which means that everything that is written after it shouldn't be executed. That would make sense if it actually always did that (see my example) -> When used simply, it seems to just add to the end of the document, instead of rewriting it -> When used in a loop, it does the same -> But when inside setInterval, It rewrites everything the first time its called -> For some reason, newlines (\n) are replaced by a space. ---------------------------- It would be nice if someone could explain why things are happening the way they are. Thanks.

html javascript document.write

18th Aug 2018, 2:07 PM

Just A Rather Ridiculously Long Username

5 Answers

+ 7

Short answer: Javascript is an event-driven system and you are writing to the page on two sides of a document state change (that is: before/after the stream is closed) Note these things: [JS] loads in <head>, before <body> is loaded. Any immediate-mode scripts here run while the DOM is loading. <body> <script> tags also run before the DOM finishes loading. setInterval runs AFTER the DOM finishes loading, because the main thread (necessarily) must exit to run events (like close, onload and firing timers) Outside answer: https://stackoverflow.com/questions/10873942/document-write-clears-page Happening here: * The document is opened and DOM begins to load. * Your [JS] scripts run. setInterval is queued for when you release the main thread and let events run. * body scripts run, then the DOM finishes loading. * The document is CLOSED, control returns to the event system, onload() event fires. * setInterval() fires * document.write OPENS the closed document, clearing it. To prove to yourself that it's not setInterval(), add a write to onload(): 'use strict'; // not everyone supports 'let', this will let a few more people test window.onload=function(){document.write("DOM is loaded")}; The document will be wiped, then setInterval() will append to it. Newlines become spaces Browsers modify/suppress text whitespaces unless contained in a <pre> (and possibly <code>) tag, where they are meaningful *content*. Otherwise, newlines mean nothing to HTML because they are not markup; <br /> is markup. Lesson (from answer): document.write is really old, conceptually (though maybe it's good for quick debugging) Probably manipulate the document using DOM methods

18th Aug 2018, 5:25 PM

Kirk Schafer

+ 2

Thanks for the answer Janning, but that was not what I was looking for. I know the difference between the two of them; my question is why both of them are not working work the way they should.

18th Aug 2018, 3:10 PM

Just A Rather Ridiculously Long Username

+ 1

https://stackoverflow.com/questions/10085109/when-should-one-use-innerhtml-and-when-document-write-in-javascript

18th Aug 2018, 3:38 PM

Janning⭐