How can I include a script with document.write?

javascript document.write
JMW picture JMW · Jul 9, 2013 · Viewed 25k times · Source

We need to add a script to our web application. It basically adds an corporate menu.

So we've received a script to include in the body of our web application:

<!-- BEGIN NAVIGATION -->
<script type="text/javascript" src="https://intranet.local/?getCorporateJsMenu"></script>
<!-- END NAVIGATION -->

And the content of https://intranet.local/?getCorporateJsMenu basically looks like this:

document.write('<script type="text/javascript" src="..."></script>');
//....
document.write('<div>');
document.write('<ul>');
//...
document.write('<li><a href="...">...</a></li>');
//...
document.write('</ul>');
document.write('</div>');

After having placed the <!--NAVIGATION--><script... directly into the HTML body, we were experiencing severe page load performance problems.

So our idea was to add the menu with JavaScript, when everything has already been loaded with something like this:

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://intranet.local/?getCorporateJsMenu';
var domparent = jQuery('#header').get();
domparent[0].appendChild(script);

With Firebug we see, that the script element has been added to the HTML content and the script has been loaded from the network, but somehow the document.write of the loaded script doesn't get executed. Why?

We cannot modify the contents of https://intranet.local/?getCorporateJsMenu since it comes from third party.

Answer

Teemu picture Teemu · Jul 9, 2013

This happens because the script execution stops at the first found literal </script> tag, no matter if it was enclosed in the parenthesis. You need to obfuscate the ending script tag, for example:

document.write('<script type="text/javascript" src="..."><\/script>');

However, it seems you use also jQuery. Why not use the jQuery methods to load a script and add the content to a page rather than document.write()?

Related questions

Dynamically add script tag with src that may include document.write

I want to dynamically include a script tag in a webpage however I have no control of it's src so src="source.js" may look like this. document.write('<script type="text/javascript">') document.write('alert("…

Read More
Execute write on doc: It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.

I am trying to load a certain script after page load executes, something like this: function downloadJSAtOnload(){ var element = document.createElement("script"); element.src = "scriptSrc"; document.body.appendChild(element); } if (window.addEventListener) window.addEventListener("load", downloadJSAtOnload, false); else if (window.…

Read More
What is the correct way to write HTML using Javascript?

It seems that experienced web developers frown upon using document.write() in JavaScript when writing dynamic HTML. Why is this? and what is the correct way?

Read More