I came across the following script earlier today, which made me double-take.

<script type="text/javascript"><!--//--><![CDATA[//><!--

{ JavaScript function removed for clarity }

//--><!]]></script>

Your thoughts?

pinkduck:

I came across the following script earlier today, which made me double-take.

<script type="text/javascript"><!--//--><![CDATA[//><!--

{ JavaScript function removed for clarity }

//--><!]]></script>

Your thoughts?

I don't think any browser needs that and I can't imagine anyone dares to make a browser that is not happy with the usual

<script type="text/javascript">
<!--

// script goes here

-->
</script>

way of hiding javascript from unaware browsers. So my take on it is that something went wrong with a homebrew CMS.

 

It's actually code from a major government education initiative in London (UK) - so you're fairly close.

The //<![CDATA[ and //]]> enclosing pair is the recommended modern approach, but it seems they've taken to commenting out the bits of JavaScript comment characters (and then some) for ultra-backwards-compatible browser support... the sort that don't recognise <script> tags as script :)

Ah, how I miss the bean-bag girl...

IIRC that's required if you want the code to work unchanged in both ancient browsers that try to display the content of script elements (the reason for the common "<!--" "// -->" hack), and in documents that are served with an XML Content-Type (where "<!--" "// -->" really is a comment, so you can't use it on its own, and additionally the <, > and & characters have their usual HTML/XML meanings so you need to use "<![CDATA[" "]]>" to escape them).

Personally I wouldn't bother with such complexity, though.  No non-utterly-obsolete browser will display the script code (even browsers that can't actually run the code are smart enough not to show it to the user), so "<!--" "-->" is out.  If I care about XHTML compatibility I'll use "<![CDATA[" "]]>", or "//<![CDATA[" "//]]>" if I want to support both XHTML and HTML.

Or, of course, you could avoid the whole issue and put the code in a separate file. ;-)

No WTF here.  This is the best way to ensure your script block passes validation and doesn't show up or cause problems in old browsers.  It looks a little ugly and is a bit hard tor ead, but it is the most correct way to do it.

/edit - was too late - useless message voided

The best way to get script into a page is to include it via the src attribute rather than embedding it the page directly (especially if you think someone out there is still using BrowserZ 1.2).  The comment markers will be parsed out by validating XHTML parsers, and the CDATA hack is simply too ugly for words--and unnecessary, since you can do a src="myScript.js" include and be past it.

Putting the script in an included .js file makes validating your script with JSLint all the easier, as well. (You ARE using JSLine, aren't you?)

joe.edwards@imaginuity.com:

No WTF here.  This is the best way to ensure your script block passes validation and doesn't show up or cause problems in old browsers.  It looks a little ugly and is a bit hard to read, but it is the most correct way to do it.

I said it was the best way you make ensure your script block works.  I didn't say writing script blocks was necessarily a good thing.

I wasn't making a comment one way or the other about what you wrote.  I was writing about the original post.  Did what I wrote, translated into some other language, come out as "get all self-defensive and write a pissy reply?"

pinkduck:

//--><!]]></script>

 Am I the only one that sees a fish in that line? <!]]><
 

joe.edwards@imaginuity.com:

No WTF here.  This is the best way to ensure your script block passes validation and doesn't show up or cause problems in old browsers.  It looks a little ugly and is a bit hard tor ead, but it is the most correct way to do it.

 (Yes, I know it's an old thread)

The only browsers that are helped by the <!-- and --> parts, which are solely to stop it from being vomited to the screen, they don't prevent interpretation of the contents as javascript (except in XHTML, i'll get to that), are much older than anything anyone uses. And I'm not saying "only a few people use them" or anything like that - do _you_ know anyone, or sincerely believe anyone exists, who regularly browses with netscape 1 or MSIE 2? Most of the rest of the crap is to compensate for the fact that XHTML browsers _do_ ignore [as in, do not interpret as javascript] what's between <!-- and -->, and isn't needed if you don't put those in.

It's necessary if all of the following are true: (A) you are serving the document as application/xhtml+xml (B) you are serving the [same] document as text/html (C) you care about compatibility with truly ancient browsers.

The sequence dissected. Here is what each parser sees. What is italic is a comment, what is bold is not.

HTML parser not supporting javascript

<script type="text/javascript"><!--//--><![CDATA[//><!--
{ JavaScript function removed for clarity }
//--><!]]></script>

HTML parser supporting javascript and allowing the comment kluge (strictly, <!-- is invalid javascript)

<script type="text/javascript"><!--//--><![CDATA[//><!--
{ JavaScript function removed for clarity }
//--><!]]></script>

Javascript parser in this case: sees

//--><![CDATA[//><!--
{ JavaScript function removed for clarity }
//--><!]]>

XHTML parser. Underline is CDATA tags, anything between them is not interpreted except to check for the end tag "]]>"

<script type="text/javascript"><!--//--><![CDATA[//><!--
{ JavaScript function removed for clarity }
//--><!]]></script>

What the Javascript parser is given by the XHTML parser, is this:

//><!--
{ JavaScript function removed for clarity }
//--><!

Also, make sure your script does not contain the sequences "-->" (ends the 'comment' for ancient browsers), "</script>" (ends the script tag for HTML parsers) or "]]>" (ends the CDATA block for XHTML parsers.) And, to add insult to injury, there is no browser configuration affected by any two of these [well, if you had "]]>" and then LATER a "</script>" it would affect xhtml, but that wouldn't be the only can of worms opened by closing the cdata block]

To support HTML4 and XHTML, all you need is

<script type="text/javascript">//<![CDATA[   Javascript stuff   //]]></script>

Much nicer. 

Random832:

The sequence dissected. Here is what each parser sees. What is italic is a comment, what is bold is not.

[snip]

Much nicer. 

TRWTF™ is you forgot that neither is rendered to those who subscribe by email.

Random832:

Also, make sure your script does not contain the sequences "-->" (ends the 'comment' for ancient browsers),

The comment end is just "--" (yes, this is strange). This occurs in real code more often than you would expect.

asuffield:

Random832:

Also, make sure your script does not contain the sequences "-->" (ends the 'comment' for ancient browsers),

The comment end is just "--" (yes, this is strange). This occurs in real code more often than you would expect.

I was aware of that "fact", but the reality is more complex: http://www.howtocreate.co.uk/SGMLComments.html 

(of course, the biggest WTF of all is that VIM has a specific parameter to its syntax highlighting to enable people to use <!-- --!>  for comments.)

Random832:

"</script>" (ends the script tag for HTML parsers)

If you want to be really picky, the script element is ended by just "</" (but if it's not part of a "</script>" it's invalid).  I don't think any browser actually implements it that way, though.

<script src="whocares.js" />

The end. 

PJH:

TRWTF™ is you forgot that neither is rendered to those who subscribe by email.

There wasn't really a better way to do it, and I figured you could open up a graphical browser 

henke37:

<script src="whocares.js" />

The end.

<script> does not have an empty content model, so using the <.../> style for it will break HTML-based browsers. You need <script src="..."></script>.

 

iwpg:

Random832:

"</script>" (ends the script tag for HTML parsers)

If you want to be really picky, the script element is ended by just "</" (but if it's not part of a "</script>" it's invalid).  I don't think any browser actually implements it that way, though.

*looks it up* Wow. You're right. I never realized that. But, yeah, nothing implements it that way, that's why a common workaround is e.g.

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

when really you should use the (also much simpler)

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

Kemp:

pinkduck:

//--><!]]></script>

 Am I the only one that sees a fish in that line? <!]]><
 

I saw it too :D