I’m just trying out HTML5 Boilerplate, and spotted what seems to be an error in one of the in-built script tags. Can anyone just confirm that the extra "" in the first </script> tag is spurious?
<script> window.jQuery || document.write('<script src="js/vendor/jquery-1.11.3.min.js"><\/script>') </script>
I don’t think it is spurious. I don’t understand it but I have used Boilerplate on a couple of sites and both have that line of code.
I tried removing it, but it started throwing errors up. It looks like it does something I don’t quite understand right now, though it does look a little odd.
It is to escape the character that is behind it.
I thought that, but then why no \ in the string js/vendor/jquery-1.11.3 ?
“unterminated string literal”
AFAIK the problem is because the closing script tag is inside surrounding script tags.
It is easy to assume that because it is inside a write() the browser would not see it as an actual closing tag,
But it seems the browser writes the new closing tag before it exits the surrounding script tags which results in improper nesting
Interestingly, if
window.jQuery || document.write('<script src="js/vendor/jquery-1.11.3.min.js"></script>')
(* not escaped) is put in an external file and called in with something like
<script src="doc-write.js"></script>
there are no errors
A bit over my head ATM (pre-caffeine),
When you use the antiquated document.write command (or any other command where you are writing HTML tags into the page) you cannot specify </script> inside of the text as that ends the current JavaScript.
You must use either '<\/script>' or '</s'+'cript>' or some other variant that will not be read by the browser as the </script> tag that ends the JavaScript.
Back in the dark ages when Netscape 4 was still around and document.write was still needed it was common to escape all closing tags by using <\/ just to make sure that the browser didn’t treat them as HTML rather than as text within the script.
To bring that code into the 21st Century I’d rewrite it as:
<script>
window.jQuery || (s = document.createElement('script'), s.src = 'js/vendor/jquery-1.11.3.min.js', document.getElementsByTagName('head')[0].appendChild(s));
</script>
(I think that should work - not the easiest of things to test - it does need to be added to the head though so it is above any scripts already added to the right place at the bottom of the body)
I’m sure there’s a logic there, but I wonder why the HTML5 Boilerplate uses an “antiquated” method like that?
I’d need to have another look at the overall organisation of the scripts being brought into the page, just to make sure I’m following the rationale correctly. Currently, all the scripts are sitting just before the closing body tag where you’d expect to see them - I’ve added a few beyond what the Boilerplate has, as I’ve been trying a couple of things out with Backbone.
I was wondering that too.
I meant with the code I posted - since that adds the script after all the other scripts at the location it would be added and so if you put it in the body it would end up at the bottom where it may not be able to be properly referenced by the scripts that use it.
Yep, understood as posted.
Currently, the scripts are ordered as follows:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.3.min.js"><\/script>')</script> <script src="js/vendor/underscore-min.js"></script> <script src="js/vendor/backbone-min.js"></script> <script src="js/vendor/backbone.localStorage-min.js"></script> <script src="js/plugins.js"></script> <script src="js/main.js"></script>
The three scripts related to Backbone/Underscore are ones I’ve added. The rest are from Boilerplate.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.