Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Document.write(<script>) throws Unexpected token "ILLEGAL"

Before you ask, I already searched a lot in Stack Overflow and I google it thousand times. Any other case I ever seen here helped me.

Let's go to my problem:

I'm trying to use the following script in my code:

<script type='text/javaScript'>
    document.write("<script src='/feeds/posts/default/-/"+hom_cat1+"?max-results=1&orderby=published&alt=json-in-script&callback=showhomeposts1'></script>");
</script>

But I'm using Blogger and it don't detect correctly my code (note the red script closing tag):

note the red script closing tag

With this, I can't save the Template. So I'm trying to use convert my code into HTML entities using this website. When I encode, put this into my template and save, I get:

Uncaught SyntaxError: Unexpected token ILLEGAL 

Here's the encoded string I'm trying to use:

&lt;script type='text/javaScript'&gt;document.write(&quot;&lt;script src='/feeds/posts/default/-/&quot;+hom_cat1+&quot;?max-results=1&amp;orderby=published&amp;alt=json-in-script&amp;callback=showhomeposts1'&gt;&lt;/script&gt;&quot;);&lt;/script&gt;

What can I do to solve my issue?

like image 330
Paladini Avatar asked Dec 23 '13 05:12

Paladini


3 Answers

The problem is that the string passed to document.write includes the characters </script>, which ends up prematurely terminating the script element that document.write is called from.

The characters </script> can't appear anywhere within a script, since the HTML parser has no way to distinguish this from an actual </script> tag.

You could try something like this instead:

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

Or, as mentioned in the comments:

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

Another option is to use the DOM API to create a script element and insert it into the document. The other answers here give some suggestions for that, but there are potential problems with the implementations (for example, document.body.appendChild will throw a TypeError if you try to call it from within the head). Something like this would be more robust:

(function() {
    var s = document.getElementsByTagName('script')[0];
    var script = document.createElement('script');
    script.src = 'http://something.com';
    s.parentNode.insertBefore(script, s);
}());

Also, type='text/javaScript' is incorrect; use text/javascript or omit the type attribute.

like image 79
Dagg Nabbit Avatar answered Nov 10 '22 16:11

Dagg Nabbit


You are writing

<script type='text/javaScript'>
    document.write("<script src='/feeds/posts/default/-/"+hom_cat1+"?max-results=1&orderby=published&alt=json-in-script&callback=showhomeposts1'></script>");
</script>

So output will be script tag inside script tag that's why your output will be

&lt;script type='text/javaScript'&gt;document.write(&quot;&lt;script src='/feeds/posts/default/-/&quot;+hom_cat1+&quot;?max-results=1&amp;orderby=published&amp;alt=json-in-script&amp;callback=showhomeposts1'&gt;&lt;/script&gt;&quot;);&lt;/script&gt;

Instead that use only document.write("");

or

var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = url;
$("#someElement").append( script );
like image 4
Just code Avatar answered Nov 10 '22 15:11

Just code


Better way to load js asynch is like this

function loadScript () {

    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = 'feeds/posts/default/your.js' 
    document.body.appendChild(script);

}

window.onload = loadScript;

or if you don't want any function, you can use direct invocation

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'feeds/posts/default/your.js' 
document.body.appendChild(script);

As suggested by google also https://developers.google.com/maps/documentation/javascript/tutorial?hl=en#asynch

like image 2
Raunak Kathuria Avatar answered Nov 10 '22 16:11

Raunak Kathuria