Back To Website Design Forum

CDATA in inline JS

  • -->gm<--
  • Student
  • Student
  • User avatar
  • Joined: Mar 19, 2004
  • Posts: 68
  • Status: Offline

Post March 3rd, 2008, 10:16 am

Hi everyone,

I was wondering what exactly the CDATA part of the HTML comment does, or how it gets processed by the browsers.
I know that if a comment is put at the start and the end of some inline js, the code is hidden from older browsers, but am curious as to the prupose of CDATA?

Code: [ Select ]
<div id="flashFile">
    <script type="text/javascript">
    // <![CDATA[
        var so = new SWFObject("swf/home.swf", "home", "710", "130", "8", "#ffffff");
        so.addParam("quality", "high");
        so.addParam("wmode", "transparent");
        so.addParam("menu", "false");
        so.addParam("loop", "true");
        so.write("flashFile");
    // ]]>
    </script>
</div>
  1. <div id="flashFile">
  2.     <script type="text/javascript">
  3.     // <![CDATA[
  4.         var so = new SWFObject("swf/home.swf", "home", "710", "130", "8", "#ffffff");
  5.         so.addParam("quality", "high");
  6.         so.addParam("wmode", "transparent");
  7.         so.addParam("menu", "false");
  8.         so.addParam("loop", "true");
  9.         so.write("flashFile");
  10.     // ]]>
  11.     </script>
  12. </div>


Thanks
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post March 3rd, 2008, 10:16 am

  • joebert
  • Sledgehammer
  • Genius
  • No Avatar
  • Joined: Feb 10, 2004
  • Posts: 13455
  • Loc: Florida
  • Status: Offline

Post March 3rd, 2008, 11:10 am

Start with the first part of this thread.

It basicly means, do not parse anything inside this element as XML, treat the entire contents as text. The parent <script> element tells the parser to treat that text as script.

Now, you might think this means you can place CDATA anywhere in the document & prevent parsing, for things like displaying source code.
Code: [ Select ]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Title</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <link rel='stylesheet' type='text/css' href='style.css' />
</head>
<body>
    <p> ... Content ... </p>
    <pre><code><![CDATA[
This should be <b>unparsable</b> content;
which displays as-is.
    ]]></code></pre>
</body>
</html>
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.     <title>Title</title>
  5.     <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  6.     <meta http-equiv="Content-Style-Type" content="text/css" />
  7.     <link rel='stylesheet' type='text/css' href='style.css' />
  8. </head>
  9. <body>
  10.     <p> ... Content ... </p>
  11.     <pre><code><![CDATA[
  12. This should be <b>unparsable</b> content;
  13. which displays as-is.
  14.     ]]></code></pre>
  15. </body>
  16. </html>


However, that's not the case. Opera is the only browser I know of that will display that <code> line as-is. Firefox will throw the contents away & IE will parse it without the <b> and show a broken HTML element on the end.
Strong with this one, the sudo is.
  • -->gm<--
  • Student
  • Student
  • User avatar
  • Joined: Mar 19, 2004
  • Posts: 68
  • Status: Offline

Post March 3rd, 2008, 11:20 am

Hi Joe,

Definitely cleared it up for me, thanks

Page 1 of 1

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 73 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.