Dojo的全称是Dojo Toolkit，始创于2004年，是当前各种蓬勃发展的JS工具包中的佼佼者。Dojo 为富互联网应用程序(RIA) 的开发提供了完整的端到端的解决方案，包括核心的 JavaScript 库，简单易用的小部件（Widget）系统和一个测试框架。
Dojo Toolkit 的特性可以分到 4 个不同部分。这种划分使得开发人员可以将库大小保持到最小，确保应用程序性能不受大量 JavaScript 库下载的影响。例如，如果您只需要 Ajax 支持性能，您只需要包含 base 包；不需要包含扩展的 Dijit UI 组件。
Base
Base 包提供 Dojo Toolkit 的基础，包括一些功能，比如 DOM 使用函数、CSS3 基于选择器的 DOM 查询、事件处理、基本的动画、以及 Dojo基于类的面向对象特性。本文主要介绍 Base。
Core
Core 包包含一些 Base 中没有包含的附加特性。通常，这些特性不像 Base 中的特性那样频繁使用；因此，它们单独加载减轻 Base 包的负担。从这一点上来讲，Core 包提供一些实际有用的组件，包括高级动画拖放、I/O、数据管理、国际化（i18n）、浏览器历史管理。
Dijit
Dijit 包包含 Dojo 小部件和组件的扩展 UI 库。这些小部件的一些示例包括对话框、日历、调色板、工具提示和树。它也包括一些表单控件，这比标准 HTML 表单控件提供更多的功能，还有一些完整的布局管理选项。
DojoX
Dojo eXtensions (DojoX) 包含工具箱的各个子项目。位于 DojoX 中的大多数是实验特性，但是也有一些稳定组件和特性。

1 dojo.require()方法

以类似C编程中#include或者Java中import的方式加载所需的部件。
例如： dojo.require("dojo.parser");

dojo.require("dijit.form.Button");

2 dojo.byId()方法

dojo.byId('Box')等价于document.getElementById('Box')，但dojo.byId能消除不同版本浏览器之间差别。

3 dojo.connect()方法

dojo.connect(obj,event,context,method,dontFix);

样例：

dojo.connect(dojo.byId('Box'),'onmouSEOver',null,onmouSEOverEvent);
function onmouSEOverEvent(event)
{
alert('移动事件：'+event);
}

4 dojo.query()方法

选择元素， dojo.uery 不区分大小写。

dojo.query() 返回的结果是 NodeList 对象，NodeList 是一个扩展的 Array 对象，很多方法支持链式调用。作为 Array 对象，NodeList 具有长度属性，而且可以通过 at， forEache， push， pop这些方法来操纵它。需要注意的是 at，map，forEach，slice，splice，contact 等都可以进行链式调用，但是 push，pop，shift 和 unshift 则是不可以的。

样例：

dojo.query("#Box");//选择id为Box的元素
dojo.query(".red");//选择class为red的元素

//查询出所有的 h1，h2，h3 节点
dojo.query("h1,h2,h3");

//使用伪类选择符，利用 nth-child 来查询 tbody 节点下所有奇数序号的子元素

dojo.query("tbody tr:nth-child(odd)");

//利用 first-child 来查询任意节点下的首个 p 子元素：
dojo.query("p:first-child");

//局部范围内的相对查询

dojo.query("button","thisForm") //查询ID为thisForm表单下的所有button元素

dojo.query("div","Box").length

备注：此处ID为thisForm或Box前面没有#符号

//链式调用dojo.query(".thinger ").style {border :"1px" }).removeClass("thinger").addClass("thinger2");

NodeList.forEach 方法
dojo.query("div").forEach(function(node,index,array){
node.innerHTML = "new version content!";
});

NodeList.style 方法
// 执行查询
var borders = dojo.query(".thinger").style("border");
// 设置新值
dojo.query(".thinger").style("border","1px solid black");
// 删除，添加 class
dojo.query(".thinger").style({border :" 3px solid red" }).removeClass("thinger").addClass("thinger2");

NodeList.connect 方法
dojo.query("input").connect(" function(e){
alert("new event!");
});
等效于
dojo.query("input").
alert("new event!");
});
NodeList直接支持的事件还包括 omouSEOut,ondblclick 等。
//NodeList 的鼠标事件
dojo.query("p").
dojo.style(e.target,"color","red");
}).
dojo.style(e.target,"blue");
});

自定义NodeList方法
dojo.extend(dojo.NodeList,{
setColor: function(newColor){
this.style({
color: newColor
});
return this;
}
});
dojo.query("p").setColor ("yellow");
注意，此处的关键是“return this”，它保证了后续链式调用的成功执行。

5 dojo.addClass()方法

dojo.addClass("span","blue");//为span元素添加blue类

6 dojo.body()方法

dojo.body方法返回document的body元素。

7 dojo.create方法

dojo.create方法创建一个元素。

dojo.create("div",{ innerHTML: "Hello world!" },dojo.body());

8 dojo.destroy方法

dojo.destroy方法会从父元素中删除该元素，并删掉该元素的所有子元素。

9 dojo.empty方法

dojo.empty方法将删除掉所有子元素。

10 dojo.forEach方法

dojo.forEach方法允许为数组或NodeList定义一个迭代器，来访问数组或NodeList中的每一项，并提供相应的操作。这个方法会忽略返回值，并且是不支持break的。

• 上一篇：Dojo 的Ajax, dojo/request <14下一篇：Dojo 创造项目, Build 使用 <16