Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is document.write actually deprecated?

Tags:

javascript

I've seen a bit of chatter about document.write being deprecated, but I'm not sure exactly where this information came from. I did look it up in MDN, but there wasn't any notation about it being deprecated.. so now I'm a bit suspicious. Google wasn't much help either unfortunately (perhaps I just wasn't using the right search terms).

If it is indeed deprecated, can someone link me to the appropriate documents showing that it is indeed deprecated?

like image 653
Stephen Avatar asked Sep 24 '12 22:09

Stephen


People also ask

Why is document write () not recommended anymore?

Another reason not to use document. write() is it doesn't support XHTML, but its not an issue since most web development uses HTML. Since document. write() fires after a page has finish loading, it causes performance issues and sometimes, may not even fire at all.

What we can use instead of document write?

Solution 1 You can do it using the property innerHTML which all elements have, for example. At first, you can put some content inside this div or leave it empty. If would be filled in by the fragment of JavaScript code shown above.

Does document write overwrite?

write after the document has loaded, it overwrites the entire document. If it is run before that, it does not overwrite it.

Why we should not use document write in Javascript?

the web browser has to pause the HTML parsing. The web browser is forced to wait for the resource to load AND to be executed. The situation could even be more harmful, as the browser will also have to wait for additional scripts that could be injected subsequently!


1 Answers

No. It's just most often considered bad practice and almost as misused as eval.

Read: Why is document.write considered a 'bad practice'?

Quoting some important points from the linked question above:

  • document.write (henceforth DW) does not work in XHTML

  • DW executed after the page has finished loading will overwrite the page, or write a new page, or not work

  • DW executes where encountered: it cannot inject at a given node point

Also as @JaredFarrish stated, deprecated is mostly a state of mind. It's a relic that most likely will never go away otherwise it'd break many sites - even the Traditional Google Analytics code uses DW.

Obviously, functionality-wise it has been superseded long ago by proper DOM manipulation methods, and quoting the linked question above again: DW is effectively writing serialised text which is not the way the DOM works conceptually.


To counterbalance, here's a list of where DW may be considered appropriate:

  • There's nothing wrong with DW, per se - it won't destroy your page if you use it appropriately;
  • It allows for easily fallbacking an external script to a local copy such as when loading jQuery from a CDN fails:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/libs/jquery-1.8.2.min.js">\x3C/script>');</script>
    
  • It's one of the easiest ways to insert external snippets in your page while keeping the code short (e.g. analytics). Note that systems such as Google Analytics now favor the asynchronous method - creating a script element through the document.createElement API, setting its properties and appending it to the DOM - rather than using its traditional document.write method.

tl;dr:
DW is easily misused, hence for real world use, prefer a proper DOM manipulation method whenever viable.

like image 118
14 revs Avatar answered Sep 28 '22 02:09

14 revs