Short jQuery works, everything else goes blank

Question

I'm trying to show "Test" depending on the screen size:

<script type="text/javascript">
jQuery(function( $ ){
if($(window).width() >= 960){
document.write('Test');
}
});
</script>

Due to a jQuery-conflict, I had to put the script within "jQuery(funcion..."

So the script works. However, the entire site loads normally, then goes blank once the script is executed, with only "Test" showing on screen. Does anyone now why?

Because of `document.write('Test');`. You are replacing your entire document with text `Test` — Vigneswaran Marimuthu, Apr 29 '15 at 05:40

score 4 · Accepted Answer · answered Apr 29 '15 at 05:40

Once document ready fires, if you use document.write() again, the document will get rewritten, if you want to append a text you can use append()

Note: as document.write writes to the document stream, calling document.write on a closed (loaded) document automatically calls document.open which will clear the document.

jQuery(function( $ ){
if($(window).width() >= 960){
$('body').append('test')
}
});

score 2 · Answer 2 · edited May 23 '17 at 11:43

2

You can't use document.write once the document has completed loading. If you do, the browser will open a new document that replaces the current.

JavaScript Document.Write Replaces All Body Content When Using AJAX

edited May 23 '17 at 11:43

Community

1
1

answered Apr 29 '15 at 05:42

Miguel Mota

20,135
5
45
64

Short jQuery works, everything else goes blank

2 Answers2