没有合适的资源?快使用搜索试试~ 我知道了~
DOJO_API_中文参考手册 附加注释实例
1星 需积分: 10 15 下载量 78 浏览量
2015-01-22
17:31:47
上传
评论 1
收藏 290KB PDF 举报
温馨提示
试读
66页
DOJO_API_中文参考手册 附加注释实例 特别适合初学者使用,学习Dojo 必备
资源推荐
资源详情
资源评论
DOJO API 中文参考手册,附加注解实例
Dojo 体系架构总体上来看是一个分层的体系架构。最下面的一层是包系统, Dojo API 的结构与 Java 很类
似,它把所有的 API 分成不
同的包( package ),当您要使用某个 API 时,只需导入这个 API 所在的包。包系统上面一层是语言库,这个语
言库里包含一些语言工具 API ,类似于 Java
的 util 包。再上一层是环境相关包,这个包的功能是处理跨浏览器的问题。 Dojo 体系架构图
Dojo 大部分代码都位于应用程序支持库,由于太小限制,图中没有列出所有的包。开发人员大部分时候都在调用
这个层中的 API ,比如,用 IO 包可以进行 Ajax 调用。
最上面的一层是 Dojo 的 Widget 系统, Widget 指的是用户界面中的一个元素,比如按钮、进度条和树等。 Dojo
的 Widget 基于 MVC 结构。它的视图作为一个 Template (模板)来进行存放,在 Template 中放置着 HTML 和
CSS 片段,而控制器来对该 Template 中的元素进行操作。 Widget 不仅支持自定义的样式表,并且能够对内部元
素的事件进行处理。用户在页面中只需要加入简单的标签就可以使用。在这一层中,存在数百个功能强大的
Widget 方便用户使用 ,包括表格、树、菜单等。
常用包介绍
Dojo 1.1.1 提供了上百个包,这些包分别放入三个一级命名空间: Dojo , Dijit 和 DojoX 。其中 Dojo 是核心功
能包 , Dijit 中存放的是 Dojo 所有的 Widget 组件,而 DojoX 则是一些扩展或试验功能, DojoX 中的试验功能
在成熟之后有可能在后续版本中移入到 Dojo 或 Dijit 命名空间中。
由于 Dojo 包种类繁多,下面只列举了最常用的一些包及其功能,以方便读者有个初步了解或供以后查阅。
djConfig
是 dojo 内置的一个全局设置对象,其作用是可以通过其控制 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.collecti
ons
很有用的集合数据结构( List 、 Query 、 Set 、 Stack 、
Dictionary... );
dojox.encoding
实现加密功能的 API ( Blowfish 、 MD5 、 Rijndael 、 SHA... );
dojox.math
数学函数(曲线、点、矩阵);
dojo.reflect
提供反射功能的函数库;
dojox.storage
将数据保存在本地存储中(例如,在浏览器中利用 Flash 的本地存储
来实现);
dojox.xml
XML 解析工具包;
首先我们需要在引用 dojo.js 前声明 djConfig 对象,以便在加载 dojo.js 的时候才能够取得所设置的值,虽然
在 0.3 版本以后 dojo
支持在加载后设置,但是强烈建议你把声明 djConfig 的代码作为第一段 script
一个完整的 djConfig 对象定义如下(值均为 dojo 的默认值)
<script type="text/javascript">
var djConfig = {
isDebug: false,
debugContainerId: "",
bindEncoding: "",
allowQueryConfig: false,
baseScriptUri: "",
parseWidgets: true
searchIds: [],
baseRelativePath: "",
libraryScriptUri: "",
iePreventClobber: false,
ieClobberMinimal: true,
preventBackButtonFix: true,
};
</script>
isDebug 是一个很有用的属性,顾名思义,如果设置为真,则所有 dojo.Debug 的输出有效,开发时应该设置为
true ,发布时应
该设置为 false
debugContainerId 同样也是与调试有关的,如果不指定的话,调试信息将会直接利用 document.write 输出,这
样可能会破坏页
面的整体布局,所以你可以指定任何一个可以作为容器的 html 元素的 id 作为调试信息输出容器
allowQueryConfig ,这个属性指明 dojo 是否允许从页面 url 的参数中读取 djConfig 中的相关属性,当值为
true 时, dojo 会优先
从 url 参数中读取 djConfig 的其他属性,比如 :
http://server/dojoDemo.htm?djConfig.debugContainerId=divDebug
baseScriptUri ,一般不需要设置, dojo 会自动根据你引用 dojo.js 的路径设置这个值,比如, <script
type="text/javascript"
src="../dojo/dojo.js"></script> ,自动获取的值便是 ../dojo/
ps: 如果你有多个工程需要同时引用 dojo.js 的话,建议也把 dojo 当作一个独立的工程,引用的时候采用绝对
路径就可以了
parseWidgets ,这个是可以控制 dojo 是否自动解析具有 dojoType 的 html 元素为对应的 widget ,如果你没有
使用任何 Widget ,
建议设置为 false 以加快 dojo 的加载速度
searchIds ,这是一个字符串数组,定义了所有需要解析为 widget 的 html 元素的 ID ,如果 ID 不在其中的
html 元素是不会被解
析的,当数组为空数组时,则所有具有 dojoType 的元素都会被解析
还有一个 bindEncoding ,是用来设置默认的 bind 请求的编码方式
至于其它的属性,不是用处不大,就是不知道有什么作用
在实际开发中,可以把 djConfig 的定义放在一个 js 文件里,并将其作为第一个引用的 js 文件,这样应该是最
方便的。
preventBackButtonFix 在 djConfig 中设置 preventBackButtonFix: false 。这样保证了隐藏的表单
( hidden IFRAME )将会添加到页面当中,如果不加入这段, dojo.undo.browser 不会正常工
作。
译者注:设置方法就是在 header 中加入如下代码:
<script language="JavaScript" type="text/javascript">
djConfig = { isDebug: true, preventBackButtonFix: false };
</script>
djConfig
是 dojo 内置的一个全局设置对象,其作用是可以通过其控制 dojo 的行为
首先我们需要在引用 dojo.js 前声明 djConfig 对象,以便在加载 dojo.js 的时候才能够取得所设置的值,
虽然在 0.3 版本以后 dojo 支持在加载后设置,但是强烈建议你把声明 djConfig 的代码作为第一段 s cript
一个完整的 djConfig 对象定义如下(值均为 dojo 的默认值)
<s cript type="text/javas cript">
var djConfig = {
isDebug: false,
debugContainerId: "",
allowQueryConfig: false,
bases criptUri: "",
parseWidgets: true
searchIds: [],
baseRelativePath: "",
librarys criptUri: "",
iePreventClobber: false,
ieClobberMinimal: true,
preventBackButtonFix: true,
};
</s cript>
isDebug 是一个很有用的属性,顾名思义,如果设置为真,则所有 dojo.Debug 的输出有效,开发时应该
设置为 true ,发布时应该设置为 false
debugContainerId 同样也是与调试有关的,如果不指定的话,调试信息将会直接利用 document.write 输出,
这样可能会破坏页面的整体布局,所以你可以指定任何一个可以作为容器的 html 元素的 id 作为调试信息
输出容器
allowQueryConfig ,这个属性指明 dojo 是否允许从页面 url 的参数中读取 djConfig 中的相关属性,当值为
true 时, dojo 会优先从 url 参数中读取 djConfig 的其他属性,比
如 : http://server/dojoDemo.htm?djConfig.debugContainerId=divDebug
bases criptUri ,一般不需要设置, dojo 会自动根据你引用 dojo.js 的路径设置这个值,比如, <s
cript type="text/javas cript" src="../dojo/dojo.js"></s cript> ,自动获取的值便是 ../dojo/
ps: 如果你有多个工程需要同时引用 dojo.js 的话,建议也把 dojo 当作一个独立的工程,引用的时候采用
绝对路径就可以了 parseWidgets ,这个是可以控制 dojo 是否自动解析具有 dojoType 的 html 元素为对
应的 widget ,如果你没有使用任何 Widget ,建议设置为 false 以加快 dojo 的加载速度
searchIds ,这是一个字符串数组,定义了所有需要解析为 widget 的 html 元素的 ID ,如果 ID 不在其中的
html 元素是不会被解析的,当数组为空数组时,则所有具有 dojoType 的元素都会被解析
至于其它的属性,不是用处不大,就是不知道有什么作用
在实际开发中,可以把 djConfig 的定义放在一个 js 文件里,并将其作为第一个引用的 js 文件,这样应该
是最方便的。
实现功能:在一个容器里点击一个链接,在另外一个容器中显示这个链接所指向页面的内容。
<html>
<head>
<script src="./dojo/dojo.js">
</script>
<script>
dojo.require("dojo.widget.ContentPane");
var links = null, display = null;
dojo.addOnLoad(init);
function init(){
links = dojo.widget.byId("links");
display = dojo.widget.byId("display");
// listen to links domNode for onclick event
// lowercased on all DOM events as opposed to widget events
//"onclick", 必须是小写的
dojo.event.connect(links.domNode, "onclick", 'relayClicks');
}
// finds out if this is a link event
function relayClicks(evt){
var node = evt.target;// 取得事件源
if(node.nodeName.toLowerCase() == "a"){
// it is a link, prevent the browser from unloading the page
evt.preventDefault();
// change page in display pane
display.setUrl(node.href);
}
}
</script>
</head>
<body>
<h1>Example on how to easily relay <a href="someurl.html" target="display"> clicks</h1>
<div dojoType="ContentPane"
widgetId="links"
style="float:left ; width: 200px; height: 400px; border: 1px solid red;"
>
<a href="link1.html">Link 1</a><br/>
<a href="link2.html">Link 2</a><br/>
<a href="link3.html">Link 3</a><br/>
</div>
<div dojoType="ContentPane"
widgetId="display" name="display" id ="display"
style="width: 600px; height: 400px; border: 1px solid blue;"
></div>
</body>
</html>
dojo.addOnLoad
可以加载指定函数到 window.load 时执行,好处就是可以很方便的在 window.load 时执行多个函数
Usage Example:
dojo.addOnLoad(init); //init 是一个函数
dojo.addOnLoad(myObject, init); //init 是 myObject 对象的一个方法
dojo.require
如果你想调用一个模块的对象的时候,你应该首先用 dojo.require 来请求这个模块, dojo 会根据你的请求自动
取得相应的 js 文
件,并加载到内存中,这样你才能调用或创建其中的对象
dojo 会自动维护已加载的模块列表,所以是不会重复加载模块的
Usage Example:
dojo.require("dojo.event");
dojo.requireIf=dojo.requireAfterIf
可以根据指定的条件来决定是否加载指定的模块
Usage Example:
dojo.requireIf(dojo.html.ie, "dojo.html"); // 如果 dojo.html.ie 为 true ,才会加载 dojo.html 模块
dojo.provide
除非你要开发自己的模块,不然是用不到这个方法的,你可以这句看成是向系统注册这个模块名称
Usage Example:
dojo.provide("dojo.custom");
dojo.exists
判断指定对象是否具有指定名称的方法
Usage Example:
dojo.exists(dojo, "exists"); //will return true
模块: dojo.io.IO
dojo.io.bind
处理请求取回需要的数据并处理
这个函数是 AJAX 中最为重要和有用的函数, dojo.io.bind 这个类是用来处理客户端与服务器
间通讯的,需要通讯的参数由对象 dojo.io.Request 所定义,具体通讯的方法则由另外一个对
象 Transport 所提供。 因此,我们如果需要与服务器通讯,则应该定义一个 Request 对象,
其中包括服务器地址及回调函数,例子中 Requset 都是以匿名对象方式定义的
虽然我们可以定义一个自己的 Transport ,但是显然不如直接利用现成的 Transport 方便。
Dojo 里提供了一个同时兼容 IE 和 Firefox 的 dojo.io.XMLHTTPTransport ,但是这个对象位于
dojo.io.BrowserIO ,因此,一般 require dojo.io.IO 时,还应该 require dojo.io.BrowserIO
Usage Example
dojo.io.bind({
url: "http://localhost/test.html", // 要请求的页面地址
mimetype: "text/html", // 请 求 的 页 面 的 类 型 , 应 该 设 置 为 与 你 请 求 页 面 类 型 对 应 的
mimetype ,默认为 "text/plain"
method : "GET", // 默认为 "GET"
sync: false, // 默认为异步执行
useCache: false, // 默认为不使用页面缓存,注意这里的缓存并不是浏览器的缓存,而是 Dojo
自身所维护的页面缓存
preventCache: false, // 默认为启用浏览器缓存,否则将通过自动增加不同的参数来确保浏
览器缓存失效
timeoutSeconds: 3000, //3 秒后超时,如果为 0 则永不超时
load: function(type, data, evt) { alert(data); }, //type should be "load", data is that we wanted
error: function(type, error) { alert(error.message); }, //error is dojo.io.Error
timeout: function(type) { alert(" 请求超时! "); }
});
你也可以用一个 handle 来处理所有的事件
dojo.io.bind({
url: "http://localhost/test.html", // 要请求的页面地址
mimetype: "text/html", // 请 求 的 页 面 的 类 型 , 应 该 设 置 为 与 你 请 求 页 面 类 型 对 应 的
mimetype
timeoutSeconds: 3000, //3 秒后超时,如果为 0 则永不超时
handle: function(type, data, evt){
if(type == "load") { alert(data); } //data is that we wanted
else if (type == "error") { alert(data.message); } //data is the error object
else { ; } //other events maybe need handled
}
});
如果没有在 Request 中指定所用的 transport ,则 Dojo 会自动的在已注册的 transports 中寻
找能够处理这个 Request 的 transport ,如果不能找到,则返回指定的 Request 。下面是一个
指定了 transport 的例子 :
dojo.io.bind({
url: "http://localhost/test.html", // 要请求的页面地址
mimetype: "text/html", // 请 求 的 页 面 的 类 型 , 应 该 设 置 为 与 你 请 求 页 面 类 型 对 应 的
mimetype
剩余65页未读,继续阅读
资源评论
- qq_168875592022-04-14排版稀烂,不建议下载
牛_人
- 粉丝: 0
- 资源: 5
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功