dojochina:http://www.dojocn.org/article-20-1.html
Dojo 1.1.1 提供了上百个包,这些包分别放入三个一级命名空间:Dojo,Dijit 和 DojoX 。其中 Dojo 是核心功能包,Dijit 中存放的是 Dojo 所有的 Widget 组件,而 DojoX 则是一些扩展或试验功能,DojoX 中的试验功能在成熟之后有可能在后续版本中移入到 Dojo 或 Dijit 命名空间中。
由于 Dojo 包种类繁多,下面只列举了最常用的一些包及其功能,以方便读者有个初步了解或供以后查阅。
包名 | 功能 |
---|---|
dojo.io | 不同的 IO 传输方式。 script、IFrame 等等; |
dojo.dnd | 拖放功能的辅助 API 。 |
dojo.string | 这个包可以对字符串进行如下的处理:修整、转换为大写、编码、esacpe、填充(pad)等等; |
dojo.date | 解析日期格式的有效助手; |
dojo.event | 事件驱动的 API,支持 AOP 开发,以及主题 / 队列的功能; |
dojo.back | 用来撤销用户操作的栈管理器; |
dojo.rpc | 与后端服务(例如理解 JSON 语法的 Web 服务)进行通信; |
dojo.colors | 颜色工具包; |
dojo.data | Dojo 的统一数据访问接口,可以方便地读取 XML、JSON 等不同格式的数据文件; |
dojo.fx | 基本动画效果库; |
dojo.regexp | 正则表达式处理函数库; |
dijit.forms | 表单控件相关的 Widget 库; |
dijit.layout | 页面布局 Widget 库; |
dijit.popup | 这个包用于以弹出窗口方式使用 Widget ; |
dojox.charting | 用于在页面上画各种统计图表的工具包; |
dojox.collections | 很有用的集合数据结构(List、Query、Set、Stack、Dictionary...); |
dojox.encoding | 实现加密功能的 API(Blowfish、MD5、Rijndael、SHA...); |
dojox.math | 数学函数(曲线、点、矩阵); |
dojo.reflect | 提供反射功能的函数库; |
dojox.storage | 将数据保存在本地存储中(例如,在浏览器中利用 Flash 的本地存储来实现); |
dojox.xml | XML 解析工具包; |
Dojo 的安装
Dojo 的安装不需要特别的环境和配置,只需要将 Dojo 包下载,解压后并将其放在自己喜欢的位置就可以。
一般来说,放在webroot下的js文件夹内,清晰又方便管理。
Dojo 版的 Hello World
前面,我们对 Dojo 的下载和安装进行了介绍。接下来,我们将通过一个 Dojo 版的 Hello World 示例来了解如何初步使用 Dojo 工具包。本节中,将通过一个客户端登陆验证的例子来进行讲述。
清单 1. 客户端登陆验证示例
<html> <head> <title>test</title> <style type="text/css"> @import "js/dojo/dojo/resources/dojo.css"; @import "js/dojo/dijit/themes/tundra/tundra.css"; </style> <script type="text/javascript" src="js/dojo/dojo/dojo.js" djConfig="parSEOnLoad: true"></script> <script type="text/javascript"> dojo.require("dojo.parser"); dojo.require("dijit.form.ValidationTextBox"); </script> </head> <body class="tundra"> name: <input name="name" type="text" dojoType="dijit.form.ValidationTextBox" maxsize=10 propercase="true" trim="true" required="true" invalidMessage="name is nessary" promptMessage="enter the name"> </body> </html> |
首先建立一个 test.html 的文件,在将清单 1 中的 dojo_path 根据自己的实际情况进行修改后,下面是对关键代码的解释:
-
djConfig="parSEOnLoad: true"表示在页面加载完成以后,启用 Dojo 的解析模块对页面中的 Dojo 标签属性(Dojo 标签属性是指由 Dojo 定义的一些标记,这些标记只有在被处理以后,才能为浏览器识别执行)进行解析。djConfig是使用 Dojo 页面的一个全局配置参数。通过对这个参数不同的赋值,可以控制页面中 Dojo 的解析模块是否运行, Dojo 的调试模块是否工作等。
-
@import "js/dojo/dijit/themes/tundra/tundra.css"表示引入 Dojo tundra 风格的层叠样式表。
-
dojo.require("dojo.parser")表示引入 Dijit 的解析功能模块。该模块将会把 Dojo 标签属性替换成浏览器可以识别执行的标记。需要与djConfig="parSEOnLoad:true"相区别的是,djConfig="parSEOnLoad:true"表示确定在页面加载完成以后执行解析功能,但解析功能模块的引入要靠dojo.require("dojo.parser")来实现。
-
dojo.require("dijit.form.ValidationTextBox");表示引入 Dojo 风格的文本验证输入框能模块。
-
<input type="text"dojoType="dijit.form.ValidationTextBox">中的dojoType表示在页面中文本输入框是 Dojo 风格的。需要注意的是,通过声明dojoType这种方式来实现某些 Dojo 功能的使用,其表现形式上如同声明一个 HTML 标签的属性(如同 width="10px"),因此在本文中称其为 Dojo 标签属性。在页面加载完成以后,Dojo 的解析模块会将 Dojo 标签属性转化为浏览器能够识别执行的标记。