JavaScript : Problem with document.write()?

Question

Im new to JavaScript and I have traced problems I have been having to this. Can you tell me what Im doing wrong.

Works
if( document.myform.box1.checked ){
document.write( "true
" );
} else {
document.write( "false
" );
}
Prints
true

Works
if( document.myform.box2.checked ){
document.write( "true
" );
} else {
document.write( "false
" );
}
Prints
true

Works
if(true){
document.write( "true
" );
}
else{
document.write( "false
" );
}
if(false){
document.write( "true
" );
}
else{
document.write( "false
" );
}
Prints
true
false

Doesnt Work
if( document.myform.box1.checked ){
document.write( "true
" );
} else {
document.write( "false
" );
}
if( document.myform.box2.checked ){
document.write( "true
" );
} else {
document.write( "false
" );
}
Prints
true

The first 3 print what you would expect, the last only prints the first line. It wont print both true/false messages. Any ideas why?

I found a work around but I am still kind of curious why it fails. I found that you can do this.

var temp = "";
if(document.myform.box1.checked){
temp += "1true";
}
if(document.myform.box2.checked){
temp += "2true";
}
document.write(temp);

Answer 1

document.write() should only be used to create inline text; "inline" meaning while the page is being rendered. If you use it after the page has rendered, it will actually clear the entire web page resulting in errors. If you want to change text on the page after it has rendered, use DIV elements and the innerHTML, innerText, outerHTML, and outerText properties.

http://msdn2.microsoft.com/en-us/library/ms533899.aspx

For what you are trying to do, I would suggest using the innerText property.

eg.

Answer 2

There is nothing wrong with the last one. There has to be something wrong with something else in the page.. e.g. you are not putting it on the right spot on the page or you forgot to put the tags around it. There's no way to debug this without looking at the rest of your webpage.