最近我在用Dojo框架技术来开发一个电子政务的表示层,现在我来谈谈我对Dojo技术的见解。
Dojo是一个利用JavaScript实现的开源的工具包,它封装了跨浏览器的代码。其核心是一些高度优化的JavaScript脚本,开发者已经对这些脚本时行了优化。而且它是一个客户端的JavaScript工具包,完全与服务器无关。
Dojo是一个分层的体系架构,它的Widget(微件,有时也称为组件)基于MVC结构。Widget不仅支持自定义的样式表,并且能够对内部元素的事件进行处理。
现在Dojo最新的版本是1.5,下载的官方网址是Http://dojotoolkit.org,API的网址是Http://dojotoolkit.org/api。建议用Google浏览器去访问,因为Google浏览器有一个在线翻译的功能,能把相应的英文翻译成中文。
在官方网站下载下来的工具包中,解压后里面有3个目录文件夹,分别是dijit、dojo、dojox。其中dojo是核心的功能包,dijit存放的是Dojo所有的Widget组件,dojox则是一些扩展或验证功能。
把下载下来的工具包复制到项目中,但是如何使用Dojo呢?
就像其它语言一样,例如在D中使用include、在Java中使用import、在Perl中使用use。在页面中如果需要用Dojo,那么就要引入核心的js文件,并要设置对应的属性。
代码示例:
在使用Dojo时,先导入Dojo自带的主题文件,Dojo自带有4个主题文件。
代码示例:
djConfig是Dojo内置的一个全局设置对象,其作用是可以通过其控制Dojo的行为。djConfig="parseOnLoad:true"表示在页面加载完成后,启用Dojo的解析模块对页面中的Dojo标签属性进行解析。Dojo的标签属性是指由Dojo定义的标记,这些标记只有在被处理后,才能被浏览器进行解析执行。djConfig是使用Dojo页面的一个全局配置参数,通过对这个参数进行不同的赋值,可以控制页面中Dojo的解析模块是否运行、Dojo的调试模块是否工作等。"isDebug:true";是一个调试用的属性,如果设置为true,刚所有的dojo.Debug的输出有效。我们在开发时应该设置为true,发布时应该设置为false。(注意,在此例中,我是把dijit、dojo、dojox这3个文件夹放到dojoroot这个文件夹中)
代码示例:
dojo.require("dojo.parser");表示引入Dijit的解析功能模块,该模块将会把Dojo标签属性替换成浏览器可以执行的标记。与djConfig="parseOnLoad:true"相区别的是,djConfig="parseOnLoad:true";表示确定在页面加载完成以后执行解析的功能,但解析功能模块的引入需要靠dojo.require("dojo.parser");来实现。
dojo.require("dijit.Menu")……表示引入Dojo风格的菜单条,也就是刚才据说的Dojo的Widget。
代码示例:
dojoType="dijit.Menu"表示页面中的菜单条是Dojo风格的。在此,需要注意的一点是,通过声明dojoType="dijit.Menu"这种方式来实现某些Dojo功能的使用,其表现形式如同声明一个HTML标签的属性(如同:Width="15px"),因此在文本中称其为Dojo标签属性。在页面加载完成后,Dojo的解析模块会将Dojo的标签属性转化为浏览器能够识别的标记。
此外,还需注意一点,就是在Dojo中的大小写问题。像dojoType、djConfig等它们都是区别大小写的,如果写错了,浏览器不会执行解析Dojo的标记。
代码示例:
在页面中使用Dojo导入主题文件后,我们要用class关键字把主题文件文件加载到body的标签里面,这样,页面在解析时就可以把对应的Dojo风格体现出来。这一步必不可少。
总的说来,在使用Dojo框架技术时,主要有5个步骤是必不可少的:
1、导入Dojo的主题文件;
2、导入Dojo的核心文件并设置对应的属性;
3、定义Dojo的组件;
4、把主题文件用class关键字加载到body的标签里面;
5、在页面中对应的标签中增加dojoType=""的属性(必需是已经定义的Dojo组件)。
另外,在使用Dojo开发时,推荐使用Firefox浏览器来调试,安装好Firefox后我们再安装一个Firebug插件即可。这样在出错时,我们便能在火狐浏览器的控制台就可知道错误出在哪个地方。
以上这些,仅是我对Dojo的使用心得,仅是Dojo框架技术的皮毛而已。适用于刚入门使用Dojo框架技术的同行,Dojo框架技术还有更深的内容,其中Dojo的精华是值的我们去研究和使用的。