jscript/javascript條件編譯

來源:互聯網
上載者:User
javascript|js|jscript|編譯|條件

IE中jscript/javascript的條件編譯

作者:JavaScript Kit
譯者:子烏(Sheneyan)
翻譯日期:2006-02-12
英文原文:Conditional Compilation of JScript/ JavaScript in IE
著作權:翻譯未經過javascript kit同意,我只對我所翻譯的中文部分負責。著作權歸原作者所有。

子烏註:如同以前的文章一樣,我只能按照我對文章的理解翻譯出來,但是我自己水平實在有限,很多地方可能存在對原文的誤解甚至是誤會,有可能的話還是讀一讀原文。

條件編譯概述

在IE中,有一個鮮為人知的功能叫做條件編譯(conditional compilation)。自從IE4開始支援這個功能,它由於在一些Ajax相關的javascript指令碼中出現而受到一些關注。條件編譯作為一種獨立形式的對象判斷,使得IE可以根據預定義或使用者定義的條件來決定你的jscript或javascript代碼特定部分是否編譯。也可以把它看成是你的代碼的條件注釋(contional comments,很快會翻譯這篇文章),使你的代碼能夠在非IE瀏覽上也順利運行。

文法概述

通過在你的指令碼中使用@cc_on來啟用條件編譯,或者直接使用@if或者@set等等作為CC邏輯中一部分的句子來啟用它。這裡是一個示範例子:

<script type="text/javascript">

/*@cc_on
document.write("JScript 版本: " + @_jscript_version + ".<br>");
   /*@if (@_jscript_version >= 5)
      document.write("JScript 版本 5.0+.<br \/>");
      document.write("只有當瀏覽器支援JScript5+的時候你才能看到這些文字.<br>");
   @else @*/
      document.write("當你使用其他瀏覽器(比如: Firefox, IE 4.x 之類)的時候看到這行文字<br>");
   /*@end
@*/

</script>

例子:

運行代碼框
<script type="text/javascript">/*@cc_ondocument.write("JScript 版本: " + @_jscript_version + ".<br />"); /*@if (@_jscript_version >= 5) document.write("JScript 版本 5.0+.<br />"); document.write("只有當瀏覽器支援JScript5+的時候你才能看到這些文字。<br />"); @else @*/ document.write("當你使用其他瀏覽器(比如: Firefox, IE 4.x 之類)的時候看到這行文字。<br />"); /*@end@*/</script>
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]

如果你使用IE(任何版本),你應該能夠看到第一個document.write()的輸出,如果是IE5+,接下來的兩個document.write()你也能夠看見(因為從IE5開始支援JScript 5)。最後一個document.write()方法是為了其他非IE5+瀏覽器服務的,無論是Firefox,opera,IE4,或者什麼別的。條件編譯依賴於類似在條件注釋中使用的注釋標籤,以確保它在所有瀏覽器中都能工作順暢。

當使用條件編譯的時候,最好先通過@cc_on語句來啟用它,只有這樣你才能在你的指令碼中包含注釋標籤以保證瀏覽器安全色,、就好像上面例子中所顯示的那樣。(子烏註:這句英文我翻譯的不是很順...看起來似乎與上面的句子矛盾)

@if, @elif, @else,@end 語句

在這個奇怪的開場白之後,這裡是一些用於條件便於的條件陳述式:

@if
@elif
@else
@end

現在讓我們看一些“古怪”的例子。

if else 邏輯 (排除IE外的瀏覽器)

/*@cc_on
   @if (@_win32)
      document.write("作業系統是32位windows。瀏覽器是IE。");
   @else
      document.write("作業系統不是32位windows。瀏覽器是IE。");
   @end
@*/

這是一段完整的指令碼,只被ie瀏覽器所識別並忽略其他所有瀏覽器,這段指令碼在不同的作業系統上將顯示不同的內容。對比一下下面這個例子……

if else 邏輯2 (包含其他瀏覽器)

/*@cc_on
  
/*@if (@_win32)
      document.write("作業系統是32位windows。瀏覽器是IE。");
   @else @*/
      document.write("瀏覽器不是IE (如: Firefox)或者瀏覽器不是在32位windows下的IE。");
  
/*@end
@*/

熟練使用注釋標籤,這個例子中的else部分能夠包含所有的非ie瀏覽器(如firefox),以及非32位windows下的IE。努力的研究這段注釋,直到你腦袋發昏,你就會明白這個邏輯了

if, elseif, else邏輯 (排除IE外的瀏覽器)

繼續吧,可以看全部內容了:

/*@cc_on
   @if (@_jscript_version >= 5)
      document.write("IE Browser that supports JScript 5+");
   @elif (@_jscript_version >= 4)
      document.write("IE Browser that supports JScript 4+");
   @else
      document.write("Very old IE Browser");
   @end
@*/

if, elseif, else 邏輯2(包含其他瀏覽器)

/*@cc_on
  
/*@if (@_jscript_version >= 5)
      document.write("IE Browser that supports JScript 5+");
   @elif (@_jscript_version >= 4)
      document.write("IE Browser that supports JScript 4+");
   @else @*/
      document.write("Non IE Browser (one that doesn't support JScript)");
  
/*@end
@*/

全面的處理。在這最後一個例子中,最後一個else語句包含了所有非IE瀏覽器。

條件編譯變數

在之前一部分中你看到了一些奇怪變數比如@_win32。這是一些你能夠用來判斷IE或電腦大致描述的預定義條件編譯變數:

在大多數情況下,你也許只需要使用@_win和@jscript_build:

/*@cc_on
   @if (@_win32)
      document.write("OS is 32-bit. Browser is IE.");
   @else
      document.write("OS is NOT 32-bit. Browser is IE.");
   @end
@*/

使用者自訂變數

你也可以在條件編譯塊中定義你自己的變數,文法如下:

@set @varname = term

在條件編譯中,數字(Numeric)與布爾(Boolean)類型的變數可以使用,但字元型(String)無法使用。比如:

@set @myvar1 = 35
@set @myvar3 = @_jscript_version

在條件編譯邏輯中能夠使用標準的運算子:

! ~
* / %
+ -
<< >> >>>
< <= > >=
== != === !==
& ^ |
&& |

你能夠通過判斷是否返回NaN來確定是否定義了一個使用者自訂變數:

@if (@newVar != @newVar)
//該變數未定義

由於NaN是唯一一個不等於其自身的值,所以這段指令碼能夠正常運行。

條件編譯樣本--try catch語句

在教程的開始,我曾經提及條件編譯如何由於在一些Ajax的JavaScript中的出現而顯示出它值得自誇的一面。現在我要告訴你我所指的內容。一個Ajax指令碼通常包含一個中心函數用於判斷瀏覽器(ie、ff等)對產生非同步請求對象的支援:

典型的ajax函數:

function HttpRequest(url, parameters){
var pageRequest = false //variable to hold ajax object
   if (window.XMLHttpRequest) // if Mozilla, Safari etc
      pageRequest = new XMLHttpRequest()
   else if (window.ActiveXObject){ // if IE
      try {
      pageRequest = new ActiveXObject("Msxml2.XMLHTTP")
      }
      catch (e){
         try{
         pageRequest = new ActiveXObject("Microsoft.XMLHTTP")
         }
         catch (e){}
      }
   }
   else
   return false
}

許多人認為try/catch語句能夠順利的測試Ajax支援,很不幸,這不是真的。那些不支援throw/catch的瀏覽器,比如IE 4.x,實際上會阻塞上面這段代碼並返回一個錯誤。為了克服這個問題,條件編譯能夠用來粗行減一個真正跨瀏覽器的友好的Ajax處理函數:

真正的跨瀏覽器函數:

function HttpRequest(url, parameters){
var pageRequest = false //variable to hold ajax object
/*@cc_on
   @if (@_jscript_version >= 5)
      try {
      pageRequest = new ActiveXObject("Msxml2.XMLHTTP")
      }
      catch (e){
         try {
         pageRequest = new ActiveXObject("Microsoft.XMLHTTP")
         }
         catch (e2){
         pageRequest = false
         }
      }
   @end
@*/

if (!pageRequest && typeof XMLHttpRequest != 'undefined')
pageRequest = new XMLHttpRequest()
}

使用條件編譯,完整的try/catch塊只用於IE5+, 其餘的瀏覽器,比如IE4或非IE瀏覽器則試著破譯它(dicipher it...這個dicipher是什嗎?“破譯”這個解釋是google到的,個人感覺翻譯成“忽略”似乎更好?)。明顯的Firefox會繼續並使用XMLHttpRequest代替。現在你就得到了它--一個真正跨瀏覽器的ajax函數!(子烏註:在我翻譯的另外一篇文章中,可以看到這個函數更全面的寫法。)



相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。