IE中的条件编译

引用

条件编译介绍

在IE有一个几乎没人知道的特性--“条件编译(Conditional Compilation)”。从IE4开始，IE开始支持这一特性，当它出现在一些Ajax相关的JavaScript中才开始引起人们的注意。它是一种对象探测的绝对形式，条件编译使IE按照用户预先定义在JScript或者JavaScript中的条件逻辑响应你的指令。你也可以把它想成是你脚本的“条件注释(Conditional Comments)”，它一样可以很好的在非IE浏览器中工作。

语法概述：

在脚本中使用 @cc_on 声明来触发条件编译机制启动，也可以直接使用 @if 或 @set 声明作为启动逻辑的一部分。下面是一段例子代码来解释如何启动条件编译机制。

 

<script type="text/javascript">  
  
/*@cc_on 
document.write("JScript version: " + @_jscript_version + ".<br>"); 
   /*@if (@_jscript_version >= 5) 
      document.write("JScript Version 5.0 or better.<br \/>"); 
      document.write("This text is only seen by browsers that support JScript 5+<br>"); 
   @else @*/  
      document.write("This text is seen by all other browsers (ie: Firefox, IE 4.x etc)<br>");  
   /*@end 
@*/  
  
</script> 

输出结果：

引用

JScript version: 5.7.
JScript Version 5.0 or better.
This text is only seen by browsers that support JScript 5+

如果你使用的是IE浏览器（任何版本），你至少应该看到第一个 document.write() 输出，如果是IE5以上版本，应当可以看到第二个 document.write() 输出。最后一个document.wirte()输出是提供给非IE5以上版本IE浏览器使用的（这话说的比较绕），比如FireFox, Opera, IE4。条件编译标签依赖注释标签协调工作，类似“条件注释”，二者结合以保证脚本能在所有浏览器中工作正常。

当脚本通过条件编译运行，最好是以 @cc_on 声明开始，因为这样你能够在脚本中包括注释标签(comment tags)来确保浏览器兼容性。

@if, @elif,@else, and @end statements

下面是 条件编译 中的语法格式：
@if
@elif
@else
@end
现在让我们看一些“生僻”的例子。
if else (IE 专有)

/*@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 
@*/  

上面这段代码只会被IE浏览器解析，而其他所有浏览器都会忽略这段代码，并且这段代码还依赖于你操作系统的位数（and depending on the bit of your OS, 应该是32位还是其他），根据不同的操作系统，这段代码会给出不同的消息。比对一下下面的例子：

if else II (其他浏览器专有)

/*@cc_on 
   /*@if (@_win32) 
      document.write("OS is 32-bit, browser is IE."); 
   @else @*/  
      document.write("Browser is not IE (ie: is Firefox) or Browser is not 32 bit IE.");  
   /*@end 
@*/  
 

通过注释标签操纵，在如Firefox的非IE浏览器以及非32位的IE浏览器中，该示例 else 块中都将提示消息。

if, elseif, else (IE 专有)

继续，整个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 II (其他浏览器专有)

/*@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或者PC某些方面的特征。


预定义的条件编译变量
变量 描述

@_win32	如果运行在Windows 32位操作系统上返回 true, 否则 NaN.
@_win16	如果运行在Windows 16位操作系统上返回 true ，否则 NaN.
@_mac	如果运行在苹果Mac操作系统上返回 true，否则 NaN.
@_alpha	如果运行在DEC Alpha处理器上返回 true，否则 NaN.
@_x86	如果运行在Intel处理器上返回 true， 否则 NaN.
@_mc680x0	如果运行在Motorola 680x0处理器上返回 true， 否则 NaN.
@_PowerPC	如果运行在Motorola PowerPC处理器上返回 true， 否则 NaN.
@_jscript	总是 返回 true.
@_jscript_build	JScript脚本引擎build代号
@_jscript_version	JScript的版本号 
IE4 支持 JScript 3.x
IE5.x 支持 JScript  5.5 or less
IE6 支持 JScript 5.6
@_debug	如果在Debug下编译返回 true， 否则 false.
@_fast	如果在快速模式下编译返回 true， 否则 false

.

大多数情况下，有可能仅仅只使用到 @_win 和 @jscript_build 变量
Js代码 

/*@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 
@*/  

用户自定义变量

用户也可以在 条件编译 代码块中 定义 自己的变量， 使用下面的语法：
Js代码 
@set @varname = term 

条件编译 同样支持数字类型和布尔类型的变量，但是不支持 字符串 变量。例如：
Js代码 

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

条件编译 中的标准 逻辑运算符 集合：
! ~
* / %
+ -
<< >> >>>
< <= > >=
== != === !==
& ^ |
&& |

可以测试一下如果用户定义一个变量，并且值为NaN：
Js代码 

@if (@newVar != @newVar)  
//this variable isn't defined.

 

只用NaN是它的唯一值并且不等于变量本身的时候才会起作用。


条件编译举例 - try catch 语句块
在本文的开始，作者提到了条件编译是开始出现在Ajax相关的JavaScript脚本当中。下面将演示作者所提到的场景。一段Ajax脚本通常会包含一段创建一个在IE和Firefox中使用的异步传输request请求的对象，而创建该对象的方法通常是固定的。

典型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  
}

 

很多人都会认为在Ajax代码中使用 "try/catch" 块是很优雅的做法，很不幸，事实上并非如此。浏览器并不支持 "throw/catch"， 就像 IE4.x，在IE4.x中运行以上代码将会报错。 要解决这一问题，可以使用 条件编译 创建一个真正跨浏览器的友好的 Ajax 解决方法：

Truly cross browser ajax function:

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浏览器无法识别。Firefox明显会使用XMLHttpRequest来替代。使用以上代码，就可以实现跨浏览器创建ajax对象的方法。



原文地址：http://www.javascriptkit.com/javatutors/conditionalcompile.shtml