The use of //<![CDATA[ vs <!--

[GameCodingNinja]

I'm a seasoned C++ programmer but this is my first experience with java scripts. I'm making a web site for my church and I added google maps to it. The code I added (works just fine) ...

<div id="map" style="width: 500px; height: 400px"></div>
<script type="text/javascript">
//<![CDATA[
    
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4);
    
//]]>
</script>

As I read up on java it says to use <!-- and //--> to hide your java code for browsers that don't support java. The below works as well.

<div id="map" style="width: 500px; height: 400px"></div>
<script type="text/javascript">
<!--
    
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4);
    
//-->
</script>

So my question is... what is //<![CDATA[ doing that <!-- isn't?

[abduraooft]

Check http://javascript.about.com/library/blxhtml.htm

[oesxyl]

I'm a seasoned C++ programmer but this is my first experience with java scripts. I'm making a web site for my church and I added google maps to it. The code I added (works just fine) ...

<div id="map" style="width: 500px; height: 400px"></div>
<script type="text/javascript">
//<![CDATA[
    
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4);
    
//]]>
</script>

As I read up on java it says to use <!-- and //--> to hide your java code for browsers that don't support java. The below works as well.

<div id="map" style="width: 500px; height: 400px"></div>
<script type="text/javascript">
<!--
    
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4);
    
//-->
</script>

So my question is... what is //<![CDATA[ doing that <!-- isn't?

with javascript code you posted is no difference in using first form and second. The reason why you must use CDATA with xhtml is to avoid replacing invalid chars, from xml point of view, like <, >, & and ', with entities.
So if your javascript don't have any of this chars inside you can get rid of CDATA.
Using // or <!-- comments it's a matter of preferences.

best regards

[Philip M]

As I read up on java it says to use <!-- and //--> to hide your java code for browsers that don't support java. The below works as well.

This is the JavaScript forum. Be aware that Java and Javascript (not Java Script) are entirely different programming languages, in spite of the confusingly similar names.

[GameCodingNinja]

with javascript code you posted is no difference in using first form and second. The reason why you must use CDATA with xhtml is to avoid replacing invalid chars, from xml point of view, like <, >, & and ', with entities.
So if your javascript don't have any of this chars inside you can get rid of CDATA.

I have the code in my aspx file so I guess it's a moot point.

Using // or <!-- comments it's a matter of preferences.

So if I understand you correctly, // and <!-- are two different ways to comment javascript code and I can use one or the other in all cases. For some reason, I thought it was a head (<!--) and tale (//-->) type thing. Just like the c style commenting. ( /* comment */).

This is the JavaScript forum. Be aware that Java and Javascript (not Java Script) are entirely different programming languages, in spite of the confusingly similar names.

bah. Thanks for the info.

[VIPStephan]

I have the code in my aspx file so I guess it's a moot point.

No, it’s not. If you serve your document as XML/XHTML you need the cdata “comments”. It doesn’t matter whether you use ASP, PHP, ASP.NET or whatever server side programming language, it’s still (X)HTML in the documents.

So if I understand you correctly, // and <!-- are two different ways to comment javascript code and I can use one or the other in all cases.

No, the only valid JS comments are // (one line) and /* */ (multi line). The arrow kind of comments are pure HTML comments and their use is deprecated nowadays.

The reason why they have been used is because early browsers that didn't support the <script> element just printed out the JS as text on the page. So to prevent that these HTML comments were used for internal scripts. However, modern browsers all support JS and this isn’t needed anymore.

[oesxyl]

So if I understand you correctly, // and <!-- are two different ways to comment javascript code and I can use one or the other in all cases. For some reason, I thought it was a head (<!--) and tale (//-->) type thing. Just like the c style commenting. ( /* comment */).

oops, is my fault for confusion, VIPStephan make clear that point. is not <!-- and -->, is /* and */, must be javascript valid. Preferences are between // and /*, */ style of comments.

best regards

[rnd me]

note that inside a document, <!-- is equal to //.

--> on it's own is a syntax error, which us why it's js-commented when used...

none of them should be used in external scripts.


don't use <!-- --> for javascript, every browser since netscape3 does not need them.
when using xhtml, always use the cdata ones for in-page script blocks, even if at the time you don't need them. otherwise, the javascript will be parsed. processing instructions, comments, literal entities like &quote; could change, unclosed tags might be detected, and stricter restrictions overall apply to the javascript code to maintain validity.

for xhtml, i recommend putting all script content in external files, linked by script tags just before </body>.
in addition to the usual dozens of advantages of external script, putting them at the bottom lets the content show up before the browser pauses to parse/eval the script. This makes it seem like your page loads faster. Since you won't be using javascript to add content before the page loads (ala document.write), no javascript is required to simply view the page, so it doesn't have to be in the head...

external files also avoid code ambiguities when mixing js and xml specifically.
for example, "]]>" could be an end of cdata section, or it could be a piece of a valid expression:

o={a:"b"};
o2={ b:5};
alert(o2[o["a"[COLOR="Red"][B]]]>[/B][/COLOR]4)

this is an academic example, but it demonstrates that xhtml script tags cannot handle all javascript code, but .src based tags can.

-$0.02

[GameCodingNinja]

Thanks for all your help guys. I moved the javascript code to a .js file and put it in a function. Below is the new code.

<div id="map" style="width: 800px; height: 550px" align="center"></div>
<script type="text/javascript">
//<![CDATA[
window.onload = ShowGoogleMap;
//]]>
</script>

The question now is do I still need the //<![CDATA[ and //]]> ?

[oesxyl]

Thanks for all your help guys. I moved the javascript code to a .js file and put it in a function. Below is the new code.

<div id="map" style="width: 800px; height: 550px" align="center"></div>
<script type="text/javascript">
//<![CDATA[
window.onload = ShowGoogleMap;
//]]>
</script>

The question now is do I still need the //<![CDATA[ and //]]> ?

no in my opinion. It's off topic but this line can also be included in the external file and so you don't need to use that block,

best regards

[GameCodingNinja]

for xhtml, i recommend putting all script content in external files, linked by script tags just before </body>.
in addition to the usual dozens of advantages of external script, putting them at the bottom lets the content show up before the browser pauses to parse/eval the script. This makes it seem like your page loads faster. Since you won't be using javascript to add content before the page loads (ala document.write), no javascript is required to simply view the page, so it doesn't have to be in the head...

That's a neat trick. Thanks for that info.