1

I have a script that uses document.write that needs to work within ajax, but I am having trouble finding a solution to make it work. here is the script that is loaded into the page via ajax.

<script type="text/javascript">
 example_widget_id = "example-1234";
example_widget_name = "registration";
example_widget_type = "example";
document.write(unescape("%3Cscript src='https://widgets.example.com/javascripts/example_widget.js' type='text/javascript'%3E%3C/script%3E"));
</script>

What happens is that the page goes blank...which is normal for document.write and ajax. I am trying to find a way to add it via innerHTML (or another solution) but I have had no luck. I looked at this thread JavaScript Document.Write Replaces All Body Content When Using AJAX but I can't seem to figure out how to make that work with what I have.

Thanks for any help you can provide.

UPDATE: The script snippet is third party widget. It is used by inserting it into a frontend web page editor that allows the user to position the content on the page anywhere they want (via ajax). Once it is positioned it can also be styled with the frontend editor. When the page is how the users wants it, they can save the layout and the front end editor is disable (turned off) until needed. When this happens the script (document.write) will then load and work fine on the page as it should without the interference of the ajax based frontend editor. I was thinking if there was a way to cache the html results of the document.write (html portion) and then that cached version could be loaded via the frontend editor. Then I can swap out the html cached version of the widget with the original script w/document.write once the front end editor becomes disabled or turn off. I played around with the logic and I am able to swap out what loads depending on the state of the front end editor. I guess my question is can a document.write content be cached or saved? I think I can handle the logic in how it is used after that.

Community
  • 1
  • 1
David Labbe
  • 107
  • 7
  • 1
    Yes. Just don't use `document.write`. Why do you think you'd need it? – Bergi Aug 24 '15 at 00:33
  • I don't have control of using it. It is from a third party source (another company and their code). – David Labbe Aug 24 '15 at 00:51
  • Then ask them to fix it, `document.write` is bad practise anyway :-) – Bergi Aug 24 '15 at 00:52
  • How can it be rewritten to work with ajax? I may need a detailed example. Thanks – David Labbe Aug 24 '15 at 00:54
  • even though you can over write the method... it's entirely possible the script within that script tag also uses it to write the content and you have may or may not be able to parse any of that part Could be a bad situation. A lot depends what's in that actual script – charlietfl Aug 24 '15 at 01:02

1 Answers1

0

There is no solution. document.write() replaces the document after the onload event have fired. It cannot be done.

You cannot make it to work*.

*note: Technically, you can make it to work if you write your own web browser because you then would be able to make your browser NOT behave like all other browsers and append instead of replace on document.write(). But you cannot make it to work with Chrome or IE or Firefox or Opera.

For a quick solution, use .innerHTML instead. For a better solution, learn the DOM manipulation API (or use a DOM library).

slebetman
  • 109,858
  • 19
  • 140
  • 171
  • 1
    *technically, overwriting `document.write` with a non-harmful function is easy :-) – Bergi Aug 24 '15 at 00:41
  • 1
    For a simple solution, just use two script tags instead of one that writes a second one. – Bergi Aug 24 '15 at 00:42
  • How would I rewrite it to use innerHTML? As I stated above in a comment the snippet is from a third party. – David Labbe Aug 24 '15 at 00:56
  • @Bergi: Overloading `document.write()` is a great solution! Care to write it up as an answer? – slebetman Aug 24 '15 at 01:02
  • @bergi yes. Any help would be great. – David Labbe Aug 24 '15 at 01:16
  • @slebetman: It might be a good way to support incompatible imported scripts, but practically it would be quite complicated to determine where to "write" the html so that it appears properly and where you want. – Bergi Aug 24 '15 at 01:20
  • @Bergi I updated the post with more inside details and if you can think of a work around for the issue. You mentioned that a simple solution would be to use two script tags instead of one that writes the second one...do mind explaining? Thanks – David Labbe Aug 24 '15 at 10:04