编写XHTML代码的规则要比编写HTML要严格得多,类似下面的代码在HTML中是有效的,但在XHTML中则是无效的。 [javascript] 复制代码 代码如下: <script type="text/javascript"> function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } </script> <script type="text/javascript"> function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } </script>
在HTML中,有特殊的规则用以确定<script>元素中的哪些内容可以被解析,但这些规则在XHTML中不适用。因为小于号(<)在XHTML中将被当作开始一个新标签来解析。但是作为标签,小于号后面不能跟空格,因此导致语法错误。 解决方法有两个:一、用相应的HTML实体(<)替换代码中所有的小于号(<);二、使用一个CData片段来包含JavaScript代码。 方法一相应代码: [javascript] 复制代码 代码如下: <script type="text/javascript"> function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } </script> <script type="text/javascript"> function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } </script>
方法二相应代码: [javascript] 复制代码 代码如下: <script type="text/javascript"><![CDATA[ function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } ]]></script> <script type="text/javascript"><![CDATA[ function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } ]]></script>
方法一虽然可以让代码在XHTML中正常运行,但却导致代码不好理解了;而方法二在兼容XHTML的浏览器中可以解决问题。但不少浏览器并不兼容XHTML,因而不支持CData片段。所以再使用JavaScript注释将CData标记注释掉。 相应代码: [html] 复制代码 代码如下: <script type="text/javascript"> //<![CDATA[ function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } //]]> </script> <script type="text/javascript"> //<![CDATA[ function compare(a, b) { if(a < b) { alert("a is less then b"); } else if(a > b) { alert("a is greater then b"); } else { alert("a is equal to b"); } } //]]> </script>
这种格式在所有现代浏览器中都可以正常使用。 附:不推荐使用的语法 [javascript] 复制代码 代码如下: <script><!-- function sayHi(){ alert("Hi!); } //--></script> <script><!-- function sayHi(){ alert("Hi!); } //--></script>