首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

IE中jscript/javascript的条件编译

Posted in Javascript onSeptember 07, 2006

IE中jscript/javascript的条件编译

  • 作者:JavaScript Kit
  • 译者:子乌(Sheneyan)
  • 翻译日期:2006-02-12
  • 英文原文:Conditional Compilation of JScript/ JavaScript in IE
  • 版权:翻译未经过javascript kit同意，我只对我所翻译的中文部分负责。版权归原作者所有。

条件编译概述

在IE中，有一个鲜为人知的功能叫做条件编译。自从IE4开始支持这个功能，它由于在一些Ajax相关的javascript脚本中出现而受到一些关注。条件编译作为一种独立形式的对象判断，使得IE可以根据预定义或用户定义的条件来决定你的jscript或javascript代码特定部分是否编译。也可以把它看成是你的代码的条件注释,使你的代码能够在非IE浏览上也顺利运行。

语法概述

通过在你的脚本中使用@cc_on来激活条件编译，或者直接使用@if或者@set等等作为CC逻辑中一部分的句子来激活它。这里是一个示范例子：

Language：javascript, parsed in: 0.007 seconds, using GeSHi 1.0.7.12
  1. <script type="text/javascript">
  2.  
  3. /*@cc_on
  4. document.write("JScript 版本: " + @_jscript_version + ".<br>");
  5.    /*@if (@_jscript_version >= 5)
  6.       document.write("JScript 版本 5.0+.<br \/>");
  7.       document.write("只有当浏览器支持JScript5+的时候你才能看到这些文字.<br>");
  8.    @else @*/
  9.       document.write("当你使用其他浏览器(比如: Firefox, IE 4.x 之类)的时候看到这行文字<br>");
  10.    /*@end
  11. @*/
  12.  
  13. </script>
  14.  
例子:
JScript 版本: 5.6.
JScript 版本 5.0+.
只有当浏览器支持JScript5+的时候你才能看到这些文字。

如果你使用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外的浏览器)
Language：javascript, parsed in: 0.001 seconds, using GeSHi 1.0.7.12
  1. /*@cc_on
  2.    @if (@_win32)
  3.       document.write("操作系统是32位windows。浏览器是IE。");
  4.    @else
  5.       document.write("操作系统不是32位windows。浏览器是IE。");
  6.    @end
  7. @*/
  8.  

这是一段完整的脚本，只被ie浏览器所识别并忽略其他所有浏览器，这段脚本在不同的操作系统上将显示不同的内容。对比一下下面这个例子……

if else 逻辑2 (包含其他浏览器)
Language：javascript, parsed in: 0.004 seconds, using GeSHi 1.0.7.12
  1. /*@cc_on
  2.    /*@if (@_win32)
  3.       document.write("操作系统是32位windows。浏览器是IE。");
  4.    @else @*/
  5.       document.write("浏览器不是IE (如: Firefox)或者浏览器不是在32位windows下的IE。");
  6.    /*@end
  7. @*/
  8.  

熟练使用注释标签，这个例子中的else部分能够包含所有的非ie浏览器（如firefox），以及非32位windows下的IE。努力的研究这段注释，直到你脑袋发昏，你就会明白这个逻辑了:)

if, elseif, else逻辑 (排除IE外的浏览器)

继续吧，可以看全部内容了：

Language：javascript, parsed in: 0.001 seconds, using GeSHi 1.0.7.12
  1. /*@cc_on
  2.    @if (@_jscript_version >= 5)
  3.       document.write("IE Browser that supports JScript 5+");
  4.    @elif (@_jscript_version >= 4)
  5.       document.write("IE Browser that supports JScript 4+");
  6.    @else
  7.       document.write("Very old IE Browser");
  8.    @end
  9. @*/
  10.  
if, elseif, else 逻辑2(包含其他浏览器)
Language：javascript, parsed in: 0.004 seconds, using GeSHi 1.0.7.12
  1. /*@cc_on
  2.    /*@if (@_jscript_version >= 5)
  3.       document.write("IE Browser that supports JScript 5+");
  4.    @elif (@_jscript_version >= 4)
  5.       document.write("IE Browser that supports JScript 4+");
  6.    @else @*/
  7.       document.write("Non IE Browser (one that doesn't support JScript)");
  8.    /*@end
  9. @*/
  10.  

全面的处理。在这最后一个例子中，最后一个else语句包含了所有非IE浏览器。

条件编译变量

在之前一部分中你看到了一些奇怪变量比如@_win32。这是一些你能够用来判断IE或计算机大致描述的预定义条件编译变量：

预定义的条件编译变量
变量 描述
@_win32 当运行在一个win32系统中时返回true, 否则返回 NaN.
@_win16 当运行在一个win16系统中时返回true , 否则返回 NaN.
@_mac 当运行在一个Apple的Macintosh系统中时返回 true , 否则返回 NaN.
@_alpha 当运行于DEC aplha处理器上时返回true ,否则返回 NaN.
@_x86 当运行于一个Intel处理上时返回true ,否则返回 NaN.
@_mc680x0 运行于Motorola 680x0处理器上时 true , 否则返回 NaN.
@_PowerPC 运行于Motorola PowerPC处理器上时 true , 否则返回 NaN.
@_jscript 永远返回 true.
@_jscript_build JScript脚本引擎编译次数.
@_jscript_version Jscript版本，以主要版本.次要版本格式展现. IE4 支持JScript 3.xIE5.x 支持 JScript  5.5-IE6 支持 JScript 5.6在JScript.net，这个版本数为7.x.
@_debug 如果编译于debug模式则返回 true ,否则返回false.
@_fast 如果编译于fast模式则返回 true ,否则返回false.

在大多数情况下，你也许只需要使用@_win和@jscript_build:

Language：javascript, parsed in: 0.001 seconds, using GeSHi 1.0.7.12
  1. /*@cc_on
  2.    @if (@_win32)
  3.       document.write("OS is 32-bit. Browser is IE.");
  4.    @else
  5.       document.write("OS is NOT 32-bit. Browser is IE.");
  6.    @end
  7. @*/
  8.  

用户自定义变量

你也可以在条件编译块中定义你自己的变量，语法如下：

Language：javascript, parsed in: 0.001 seconds, using GeSHi 1.0.7.12
  1. @set @varname = term
  2.  

在条件编译中，数字与布尔类型的变量可以使用，但字符型无法使用。比如：

Language：javascript, parsed in: 0.002 seconds, using GeSHi 1.0.7.12
  1. @set @myvar1 = 35
  2. @set @myvar3 = @_jscript_version
  3.  

在条件编译逻辑中能够使用标准的运算符：

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

你能够通过判断是否返回NaN来确定是否定义了一个用户自定义变量:

Language：javascript, parsed in: 0.002 seconds, using GeSHi 1.0.7.12
  1. @if (@newVar != @newVar)
  2. //该变量未定义
  3.  

由于NaN是唯一一个不等于其自身的值，所以这段脚本能够正常运行。

条件编译示例－－try catch语句

在教程的开始，我曾经提及条件编译如何由于在一些Ajax的JavaScript中的出现而显示出它值得自夸的一面。现在我要告诉你我所指的内容。一个Ajax脚本通常包含一个中心函数用于判断浏览器（ie、ff等）对产生异步请求对象的支持:

典型的ajax函数:

Language：javascript, parsed in: 0.020 seconds, using GeSHi 1.0.7.12
  1. function HttpRequest(url, parameters){
  2. var pageRequest = false //variable to hold ajax object
  3.    if (window.XMLHttpRequest) // if Mozilla, Safari etc
  4.       pageRequest = new XMLHttpRequest()
  5.    else if (window.ActiveXObject){ // if IE
  6.       try {
  7.       pageRequest = new ActiveXObject("Msxml2.XMLHTTP")
  8.       }
  9.       catch (e){
  10.          try{
  11.          pageRequest = new ActiveXObject("Microsoft.XMLHTTP")
  12.          }
  13.          catch (e){}
  14.       }
  15.    }
  16.    else
  17.    return false
  18. }
  19.  

许多人认为try/catch语句能够顺利的测试Ajax支持，很不幸，这不是真的。那些不支持throw/catch的浏览器，比如IE 4.x，实际上会阻塞上面这段代码并返回一个错误。为了克服这个问题，条件编译能够用来粗行减一个真正跨浏览器的友好的Ajax处理函数:

真正的跨浏览器函数:

Language：javascript, parsed in: 0.008 seconds, using GeSHi 1.0.7.12
  1. function HttpRequest(url, parameters){
  2. var pageRequest = false //variable to hold ajax object
  3. /*@cc_on
  4.    @if (@_jscript_version >= 5)
  5.       try {
  6.       pageRequest = new ActiveXObject("Msxml2.XMLHTTP")
  7.       }
  8.       catch (e){
  9.          try {
  10.          pageRequest = new ActiveXObject("Microsoft.XMLHTTP")
  11.          }
  12.          catch (e2){
  13.          pageRequest = false
  14.          }
  15.       }
  16.    @end
  17. @*/
  18.  
  19. if (!pageRequest && typeof XMLHttpRequest != 'undefined')
  20. pageRequest = new XMLHttpRequest()
  21. }
  22.  

使用条件编译，完整的try/catch块只用于IE5+, 其余的浏览器，比如IE4或非IE浏览器则试着破译它(dicipher it...这个dicipher是什么？“破译”这个解释是google到的,个人感觉翻译成“忽略”似乎更好？)。明显的Firefox会继续并使用XMLHttpRequest代替。现在你就得到了它－－一个真正跨浏览器的ajax函数！（子乌注：在我翻译的另外一篇文章中，可以看到这个函数更全面的写法。）

IE中jscript/javascript的条件编译

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
JavaScript?Apple设备检测示例代码
Nov 15 Javascript
原生js的弹出层且其内的窗口居中
May 14 Javascript
JavaScript时间转换处理函数
Apr 14 Javascript
Node.js实现Excel转JSON
Apr 24 Javascript
javascript结合canvas实现图片旋转效果
May 03 Javascript
vue实现简单实时汇率计算功能
Jan 15 Javascript
基于js 本地存储(详解)
Aug 16 Javascript
微信小程序实现多选功能
Nov 04 Javascript
Vue Prop属性功能与用法实例详解
Feb 23 Javascript
如何用vue-cli3脚手架搭建一个基于ts的基础脚手架的方法
Dec 12 Javascript
在vue中实现嵌套页面(iframe)
Jul 30 Javascript
关于uniApp editor微信滑动问题
Jan 15 Javascript
prototype 1.5 &amp; scriptaculous 1.6.1 学习笔记
Sep 07 #Javascript
彪哥1.1(智能表格)提供下载
Sep 07 #Javascript
日期函数扩展类Ver0.1.1
Sep 07 #Javascript
js脚本学习 比较实用的基础
Sep 07 #Javascript
prototype 的说明 js类
Sep 07 #Javascript
你的编程语言可以这样做吗？
Sep 07 #Javascript
音乐播放用的的几个函数
Sep 07 #Javascript
类加载器(1) 加密(1) Launch Mode(1) 解密(1) netty(1) logging(1) hashlib(1) NoSQL(1) Pickle(1) apt命令(1)
You might like
apache+mysql+php+ssl服务器之完全安装攻略
2006/09/05 PHP
AMFPHP php远程调用(RPC, Remote Procedure Call)工具 快速入门教程
2010/05/10 PHP
关于zend studio 出现乱码问题的总结
2013/06/23 PHP
php自定义中文字符串截取函数substr_for_gb2312及substr_for_utf8示例
2016/05/28 PHP
Yii遍历行下每列数据的方法
2016/10/17 PHP
PHP多维数组元素操作类的方法
2016/11/14 PHP
PHP设计模式之装饰器（装饰者）模式（Decorator）入门与应用详解
2019/12/13 PHP
jquery中的事件处理详细介绍
2013/06/24 Javascript
javascript中的parseInt和parseFloat区别
2013/07/12 Javascript
js判断浏览器类型的方法
2013/08/07 Javascript
jQuery 仿百度输入标签插件附效果图
2014/07/04 Javascript
JS数组的常见用法实例
2015/02/10 Javascript
js生成随机数的方法实例
2015/10/16 Javascript
JavaScript获取浏览器信息的方法
2015/11/20 Javascript
简单谈谈ES6的六个小特性
2016/11/18 Javascript
微信小程序开发之tabbar图标和颜色的实现
2018/10/17 Javascript
jQuery选择器之基本过滤选择器用法实例分析
2019/02/19 jQuery
js实现无缝滚动双图切换效果
2019/07/09 Javascript
在vue中使用防抖和节流,防止重复点击或重复上拉加载实例
2019/11/13 Javascript
Vue 401配合Vuex防止多次弹框的案例
2020/11/11 Javascript
vc6编写python扩展的方法分享
2014/01/17 Python
详解python3百度指数抓取实例
2016/12/12 Python
Django中间件工作流程及写法实例代码
2018/02/06 Python
nginx搭建基于python的web环境的实现步骤
2020/01/03 Python
Python AutoCAD 系统设置的实现方法
2020/04/01 Python
Python xml、字典、json、类四种数据类型如何实现互相转换
2020/05/27 Python
Python 操作SQLite数据库的示例
2020/10/16 Python
全天然狗零食：Best Bully Sticks
2016/09/22 全球购物
Zavvi美国：英国娱乐之家
2017/03/19 全球购物
BCBG官网：BCBGMAXAZRIA
2017/12/29 全球购物
施华洛世奇日本官网：SWAROVSKI日本
2018/05/04 全球购物
小学师德师风演讲稿
2014/09/02 职场文书
物联网工程专业推荐信
2014/09/08 职场文书
大学生党校培训心得体会
2014/09/11 职场文书
辩护词范文大全
2015/05/21 职场文书
教师培训简讯
2015/07/20 职场文书