JavaScript在XHTML中的用法

編寫XHTML代碼的規則要比編寫HTML要嚴格得多，類似下面的代碼在HTML中是有效，但在XHTML中則是無效的。

<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實體（&lt;）替換代碼中所有的小於符號（<）；二、使用一個CData片段來包含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"><![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標記注釋掉。

相應代碼：

<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><!-- function sayHi(){  alert("Hi!); }//--></script>

像上面這樣把JavaScript程式碼封裝含在一個HTML注釋中可以讓不支援<script>元素的瀏覽器隱藏嵌入的JavaScript代碼，即忽略<script>標籤中的內容，而那些支援JavaScript的瀏覽器在遇到這種情況時，則必須進一步確認其中是否包含需要解析的JavaScript代碼。

雖然這種注釋格式得到了所有瀏覽器的認可，也能被正確的解釋，但由於所有瀏覽器都已經支援JavaScript，因此也就沒有必要再使用這種格式了。

以上內容由斌斌（給我寫信）根據[Nicholas
C. Zakas]著的《JavaScript進階程式設計（第2版）》第2章【在HTML中使用JavaScript】整理，更多資訊請參考原著。

歡迎訪問斌斌 (給我寫信)部落格（http://blog.csdn.net/binbinxyz）