淺談XHTML(可擴展HTML)標準中CDATA

轉自:http://www.chinahtml.com/0706/xhtml-118219995914399.html


近來,隨着XHTML(可擴展HTML)標準的出現,<script/>標籤也經歷了一些改變。該標籤不再用language特性,而用type特性聲明內嵌代碼或要加入的外部文件的mime類型,JavaScript的mime類型是"text/javascript"。例如:

<html>  
 <head>  
 <title>Title of Page</title>  
 <script type=”text/javascript”>  
 var i = 0;   
 </script>  
 <script type=”text/javascript” src=”../scripts/external.js”></script>  
 </head>  
 <body>  
 <!-- body goes here -->  
 </body>  
</html> 

  即使許多瀏覽器不完全支持XHTML,但大多數開發者現在都用type特性,而不用language特性,以提供更好的XHTML支持。省略language特性不會帶來任何問題,因爲如前所述,所有瀏覽器都默認<script/>的該屬性值爲JavaScript。

  XHTML的第二個改變是使用CDATA段。XML中的CDATA段用於聲明不應被解析爲標籤的文本(XHTML也是如此),這樣就可以使用特殊字符,如小於(<)、大於(>)、和號(&)和雙引號("),而不必使用它們的字符實體。考慮下面的代碼:

<SCRIPT type=”text/javascript”>  
 function compare(a, b) {  
 if (a < b) {  
 alert(“A is less than B”);  
 } else if (a > b) {  
 alert(“A is greater than B”);  
 } else {  
 alert(“A is equal to B”);  
 }  
}  
</SCRIPT> 

  這個函數相當簡單,它比較數字a和b,然後顯示消息說明它們的關係。但是,在XHTML中,這段代碼是無效的,因爲它使用了三個特殊符號,即小於、大於和雙引號。要修正這個問題,必須分別用這三個字符的XML實體<、>和"替換它們:

<SCRIPT type=”text/javascript”>  
function compare(a, b) {  
if (a < b) {  
alert("A is less than B");  
} else if (a > b) {  
131  
JavaScript in the Browser  
alert("A is greater than B");  
} else {  
alert("A is equal to B");  
}  
}  
</SCRIPT> 

  這段代碼存在兩個問題。首先,開發者不習慣用XML實體編寫代碼。這使代碼很難讀懂。其次,在JavaScript中,這種代碼實際上將視爲有語法錯,因爲解釋程序不知道XML實體的意思。用CDATA段即可以以常規形式(即易讀的語法)編寫JavaScript代碼。正式加入CDATA段的方法如下:

<SCRIPT type=”text/javascript”>
<![CDATA[  
function compare(a, b) {  
if (a < b) {  
alert(“A is less than B”);  
} else if (a > b) {  
alert(“A is greater than B”);  
} else {  
alert(“A is equal to B”);  
}  
}  
]]>
</SCRIPT>

  雖然這是正式方式,但還要記住,大多數瀏覽器都不完全支持XHTML,這就帶來主要問題,即這在JavaScript中是個語法錯誤,因爲大多數瀏覽器還不認識CDATA段。

  當前使用的解決方案模仿了“對舊瀏覽器隱藏”代碼的方法。使用單行的JavaScript註釋,可在不影響代碼語法的情況下嵌入CDATA段:

<SCRIPT type=”text/javascript”>  
//<![CDATA[  
function compare(a, b) {  
if (a < b) {  
alert(“A is less than B”);  
} else if (a > b) {  
alert(“A is greater than B”);  
} else {  
alert(“A is equal to B”);  
}  
}  
//]]>  
</SCRIPT>


發佈了6 篇原創文章 · 獲贊 6 · 訪問量 41萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章