Here's how it works:
With all these comments and hiding, it's not a bad idea to create a template for starting out with your script-based pages. You can use that template to begin pages from scratch, or you can cut and paste all the default scripting comments and elements to get a head start.
If you're hiding scripts within your Web document, you'll need to use the XHTML Transitional DTD. If you want to use the strict DTD with scripts, you can, but only if you link to your script's function definitions instead of embedding them in the page (more on that in a moment), or if you take an additional hiding step within the page.
In this case, the <![CDATA[ and ]]> tags are used to tell the XML parser to ignore what comes between them. At least, that's the official recommendation. The problem is that this method of hiding is still somewhat theoretical. It may be the desired approach for future Web browsers, but right now it simply doesn't work. So, using the strict DTD with the <script> element in your pages is tough.
If you really want to use the strict DTD, there is another solution. You can place the script function declarations (the script portions that appear in the <head> of your document) in a separate document and link to it. That would look something like
Technically, each instance of the <script> element should include a type attribute (although not all Web browsers require this to the letter). You can get around that, however, by declaring a default using the <meta> element in the <head> of your document:
Finally, XHTML also offers the option of a <noscript> container that can be used within a <script> element to offer alternative text and markup for browsers that don't support scripting. That looks something like
Let's put it all together in a template and a quick example.
Whenever you learn a new programming language, traditionally the first example you encounter is a "Hello World" script or program. This Hello World example will show you the basics of the hiding and scripting commands and how the <script> elements work.
This example offers a few things worth discussing:
The <script> container has been added in the <body> of the document. That's typical when you're using the script to create something within the document's body, instead of defining functions, which happens in the <head>. In more complicated scripts, you'll likely have <script> containers in both sections.
Within the document.writeln() command, the closing </h1> tag actually looks like <\/h1>. That's because the closing / would otherwise be misinterpreted by the document.writeln() method as the beginning of a special character, such as the newline (/n) character. So, you need to escape the forward slash using the backslash.
Because you're using the <meta> element to specify the scripting content, you don't need a type attribute for <script>. However, the language attribute is still there for backward compatibility.
Figure 2 Here's the result of the Hello World script in all its glory.