1

I dont know if this is a good idea but I am trying to add a script using document.write in my HTML document that would add a script only if the browser is online.

<script>
var online = navigator.onLine;
if(online){
  document.write("<script src='./api.js'></script>");
}
</script>

the thing is the browser is stoping at the first closing </script> tag that is inside the document.write function, causing everything else to be interpreted as HTML ( "); appears renedered in the html) , I know that I am doing something wrong but would like to know what

Mg Gm
  • 151
  • 1
  • 11
  • Note: [Why split the – Jonathan Lonowski Jul 08 '14 at 21:32
  • Note the return value of `navigator.onLine` wither true or false will not definitively let you know wither the user has an active internet connection or not. – Patrick Evans Jul 08 '14 at 21:32
  • this is not an app for the general public , it's an isolated app that i will be showcasing on a screen using chrome at a gallery and therefore external users and browser fallbacks have been disregarded – Mg Gm Jul 08 '14 at 21:39

3 Answers3

2

Try this:

document.write("<script src='./api'></"+"script>");

You're right. Browsers read all <script> ... </script> block and pass them to JS engine. So, if you want to write </script> you should break it.

Note Using document.write to add JavaScript to document is not a good idea.

taggon
  • 1,896
  • 13
  • 11
1

EDIT: please see this thread and answers: https://stackoverflow.com/a/8024286/2192152

Here is a code I used for a personal website:

/* *************************************************************
 *  Loading any js file.
 ************************************************************** */
staticPath ='./js/';
vendorPath='./js/vendor/';

src = [
    {f:'jquery-1.8.3.min.js', n:1},
    {f:'jquery-ui-1.9.2.js', n:1},
    {f:'lib.js', n:0},        
];


for (var i in src)
{
    if (src[i].n === 0) document.write('<' + 'script type="text/javascript" src="' + staticPath + src[i].f + '"></sc' + 'ript>');
    else  document.write('<' + 'script type="text/javascript" src="' + vendorPath + src[i].f + '"></sc' + 'ript>');
}

As you can see you should split the string containing you script call. I unfortunately don't know much more of why this is needed.

Note: I tried many setting and the one I provide you here is the fastest one in terms of load time (using chrome)

Community
  • 1
  • 1
Xspirits
  • 217
  • 2
  • 7
  • also, http://stackoverflow.com/questions/236073/why-split-the-script-tag-when-writing-it-with-document-write – blex Jul 08 '14 at 21:31
1

You could try:

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "./api.js";
document.head.appendChild(script);

also are you missing extension on api? should it be api.js?

Jacek Pietal
  • 1,980
  • 1
  • 18
  • 27
  • it somehow works without the extension as a js file but adding it would be more intuitive, i will edit my question for the sake of better understanding – Mg Gm Jul 08 '14 at 21:41
  • just change `api` in the line `script.src = "./api";` to correct filename after you change it – Jacek Pietal Jul 08 '14 at 21:42