|
蓝森林 http://www.lslnet.com 2006年8月25日 8:28
 [翻译]IE中jscript/javascript的条件编译
[b][size=6]IE中jscript/javascript的条件编译[/size][/b]
作者:[url=http://www.javascriptkit.com/]JavaScript Kit
译者:[url=http://sheneyan.com/]子乌(Sheneyan)
翻译日期:2006-02-12
英文原文:[url=http://www.javascriptkit.com/javatutors/conditionalcompile.shtml]Conditional Compilation of JScript/ JavaScript in IE
译文地址:[url=http://sheneyan.com/g.php/tech/article/js/conditionalcompile.html][翻译]IE中jscript/javascript的条件编译
版权:翻译未经过javascript kit同意，我只对我所翻译的中文部分负责。版权归原作者所有。
[[color=#555555]子乌注：如同以前的文章一样，我只能按照我对文章的理解翻译出来，但是我自己水平实在有限，很多地方可能存在对原文的误解甚至是误会，有可能的话还是读一读原文。[/color]]
[b][size=5]条件编译概述[/size][/b]
在IE中，有一个鲜为人知的功能叫做[b]条件编译[/b](conditional compilation)。自从IE4开始支持这个功能，它由于在一些Ajax相关的javascript脚本中出现而受到一些关注。条件编译作为一种独立形式的对象判断，使得IE可以根据预定义或用户定义的条件来决定你的jscript或javascript代码特定部分是否编译。也可以把它看成是你的代码的[url=http://www.javascriptkit.com/howto/cc.shtml]条件注释(contional comments,很快会翻译这篇文章),使你的代码能够在非IE浏览上也顺利运行。
[b][size=4]语法概述[/size][/b]
通过在你的脚本中使用[b]@cc_on[/b]来激活条件编译，或者直接使用[b]@if[/b]或者[b]@set[/b]等等作为CC逻辑中一部分的句子来激活它。这里是一个示范例子：
[code]
<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>
[/code]
[b][size=3]例子:[/size][/b]
[html]
<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>
[/html]
如果你使用IE（任何版本），你应该能够看到第一个[b]document.write()[/b]的输出，如果是IE5+,接下来的两个[b]document.write()[/b]你也能够看见（因为从IE5开始支持JScript 5）。最后一个[b]document.write()[/b]方法是为了其他非IE5+浏览器服务的，无论是Firefox，opera，IE4,或者什么别的。条件编译依赖于类似在条件注释中使用的注释标签，以确保它在所有浏览器中都能工作顺畅。
当使用条件编译的时候，最好先通过[b]@cc_on[/b]语句来激活它，只有这样你才能在你的脚本中包含注释标签以保证浏览器兼容，、就好像上面例子中所显示的那样。(子乌注：这句英文我翻译的不是很顺...看起来似乎与上面的句子矛盾)
[b][size=4]@if, @elif, @else,@end 语句[/size][/b]
在这个奇怪的开场白之后，这里是一些用于条件便于的条件语句：
@if
@elif
@else
@end
现在让我们看一些“古怪”的例子。
[b][size=3]if else 逻辑 (排除IE外的浏览器)[/size][/b]
[code]
/*@cc_on
@if (@_win32)
document.write("操作系统是32位windows。浏览器是IE。");
@else
document.write("操作系统不是32位windows。浏览器是IE。");
@end
@*/
[/code]
这是一段完整的脚本，只被ie浏览器所识别并忽略其他所有浏览器，这段脚本在不同的操作系统上将显示不同的内容。对比一下下面这个例子……
[b][size=3]if else 逻辑2 (包含其他浏览器)[/size][/b]
[code]
/*@cc_on
/*@if (@_win32)
document.write("操作系统是32位windows。浏览器是IE。");
@else @*/
document.write("浏览器不是IE (如: Firefox)或者浏览器不是在32位windows下的IE。");
/*@end
@*/
[/code]
熟练使用注释标签，这个例子中的[b]else[/b]部分能够包含所有的非ie浏览器（如firefox），以及非32位windows下的IE。努力的研究这段注释，直到你脑袋发昏，你就会明白这个逻辑了:)
[b][size=3]if, elseif, else逻辑 (排除IE外的浏览器)[/size][/b]
继续吧，可以看全部内容了：
[code]
/*@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
@*/
[/code]
[b][size=3]if, elseif, else 逻辑2(包含其他浏览器)[/size][/b]
[code]
/*@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
@*/
[/code]
全面的处理。在这最后一个例子中，最后一个[b]else[/b]语句包含了所有非IE浏览器。
[b][size=5]条件编译变量[/size][/b]
在之前一部分中你看到了一些奇怪变量比如[b]@_win32[/b]。这是一些你能够用来判断IE或计算机大致描述的预定义条件编译变量：
[attach]3753[/attach]
在大多数情况下，你也许只需要使用[b]@_win[/b]和[b]@jscript_build[/b]:
[code]
/*@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
@*/
[/code]
[b][size=4]用户自定义变量[/size][/b]
你也可以在条件编译块中定义你自己的变量，语法如下：
[code]
@set @varname = term
[/code]
在条件编译中，[b]数字[/b](Numeric)与[b]布尔[/b](Boolean)类型的变量可以使用，但[b]字符型[/b](String)无法使用。比如：
[code]
@set @myvar1 = 35
@set @myvar3 = @_jscript_version
[/code]
在条件编译逻辑中能够使用标准的运算符：
! ~
* / %
+ -
<< >> >>>
< <= > >=
== != === !==
& ^ |
&& |
你能够通过判断是否返回[b]NaN[/b]来确定是否定义了一个用户自定义变量:
[code]
@if (@newVar != @newVar)
//该变量未定义
[/code]
由于[b]NaN[/b]是唯一一个不等于其自身的值，所以这段脚本能够正常运行。
[b][size=5]条件编译示例－－try catch语句[/size][/b]
在教程的开始，我曾经提及条件编译如何由于在一些Ajax的JavaScript中的出现而显示出它值得自夸的一面。现在我要告诉你我所指的内容。一个Ajax脚本通常包含一个中心函数用于判断浏览器（ie、ff等）对产生异步请求对象的支持:
[b][size=4]典型的ajax函数:[/size][/b]
[code]
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
}
[/code]
许多人认为[b]try/catch[/b]语句能够顺利的测试Ajax支持，很不幸，这不是真的。那些不支持[b]throw/catch[/b]的浏览器，比如IE 4.x，实际上会阻塞上面这段代码并返回一个错误。为了克服这个问题，条件编译能够用来粗行减一个真正跨浏览器的友好的Ajax处理函数:
[b][size=4]真正的跨浏览器函数:[/size][/b]
[code]
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()
}
[/code]
使用条件编译，完整的[b]try/catch[/b]块只用于IE5+, 其余的浏览器，比如IE4或非IE浏览器则试着破译它(dicipher it...这个dicipher是什么？“破译”这个解释是[url=http://www.google.com/search?hl=zh-CN&newwindow=1&q=dicipher+%E5%90%AB%E4%B9%89&lr=]google到的,个人感觉翻译成“忽略”似乎更好？)。明显的Firefox会继续并使用XMLHttpRequest代替。现在你就得到了它－－一个真正跨浏览器的ajax函数！（子乌注：在我翻译的另外一篇[url=http://sheneyan.com/g.php/tech/article/ajax/httprequest.html]文章中，可以看到这个函数更全面的写法。）
|
@if
@elif
@else
@end
这些写法相当好看了！！！ |
@-@
睁大眼睛看清楚~~~ |
| 才注意到这贴子沉到那么后面...偷偷顶上来...:p |
| 不错，顶 |
很好!
UP! |
| thanks. |
|
