作者：Matthew Russell，原文链接
2008年2月29日，星期五，11:07AM

本周末，这本书的最终版一交稿，我就会立刻拥有大量的空闲时间。因此，我决定围绕基本的Dojo构建块写一个对读者有所帮助的简短的专栏。虽然这个专栏不可能像读者在书中所看到的那样给大家呈现“权威指南”般详尽的讲解，但我希望能够通过它来展示一些工具，提升读者对Dojo的理解和认识，并且也希望读者能够因此体验到Dojo的魅力。

作为专栏开篇，我们下面就从Base讲起。Base是经过高度优化的工具箱内核，我喜欢把它看成是JavaScript标准库，要使用Dojo没有它是万万不行的。简单地说，Base提供了一系列语言实用程序，针对那些可能会导致代码膨胀的“你想实现但又不必自己编码的任务”。我们知道，为节点添加样式、添加和移除类、查询DOM、处理作用域、简单的褪色动画、标准化事件模型，以及操作列表等等任务恐怕是没有穷尽的（几乎如此）。

AOL通过它们的CDN（Content Delivery Network，内容分发网络）提供在线的Dojo支持，而其中Base的“通过网络传输”（经过gzip压缩）仅有约27KB，这就让Dojo很臃肿的说法不攻自破了。27KB是一个比充斥于Web中的大多数Flash广告都要小的净荷，即使最慢的连接也能在瞬间完成下载。AOL的CDN作为一种地理边际缓存（ edge-cached）系统，不会让你苦苦等待页面加载。

闲话少说，言归正传。接下来我们就开始介绍一些实用的代码。用于将Base加载到页面中的基本模板如下所示：

如你所见，这个页面模板中除了包含一个加载Dojo组件的SCRIPT标签之外没有什么特别之处。其中，dojo.addOnLoad块提供了安全使用Dojo的空间，这个块之所以必要是因为SCRIPT标签与文档不同步。这一点同其他工具箱也很相似，例如jQuery中的ready事件。

好，下面我们开始介绍Dojo的用法。

Dojo中一个最常用的特性就是dojo.query基本函数。这个函数接收的第一个参数是一个CSS选择符，然后根据该选择符查询DOM并返回符合条件的NodeList对象。NodeList是Array的子类，在Base中定义，并为连缀其他操作提供了语法糖衣（syntactic sugar，由Peter J. Landin创造的一个术语，指的是为一门计算机语言的语法中添加的附加物或附加成分，它不会影响语言的功能，但却能使人类使用起该语言来”更甜美”一些。——译者注）。有关dojo.query的官方API参见这里。

假设我们希望在有人单击链接时会执行某种操作——例如，触发一个警告框，以便在用户离开页面前显示一句告别的话。下面就是我们需要添加的代码：

解释一下这几行代码：dojo.query函数接收了一个CSS选择符（表示要查找页面中所有的锚元素——在这个例子中只有一个），然后对返回的结果调用了NodeList的onclick方法，该方法为结果中的每个对象指定了一个自定义的处理程序。这样，当用户（通过单击链接）离开页面时，这个处理程序就会触发一个讨厌的弹出警告框，仅此而已。

但是，有一点读者可能不知道，作为参数传递给自定义函数的evt变量根据W3C规范进行了标准化，因此这个事件对象完全可以跨平台使用。例如，为了阻止单击链接离开页面时的默认动作，可以像下面这样调用preventDefault：

不过，这还不是全部。NodeList在DOM事件中也包装了很多有用的功能，而且还提供了按索引操作NodeList、操作类、切割NodeList等等功能——估计涵盖了你能想到的所有操作。可以单击这里查看NodeList的完整API。

下面，我们进一步扩展前面的例子，让链接在鼠标悬停状态下能够突出显示。修改后的代码如下所示：

如上所示，连缀结果同我们想象的一样直观明了，而其中唯一一个新特性就是无需过多解释的dojo.style函数。一般来说，dojo.style接收3个参数：一个节点（符合W3C规范，能够通过evt.target获取）、一个样式名和为该样式指定的一个值。这个例子只是在鼠标悬停于节点时添加了黄色背景，而在鼠标离开节点时删除了背景。有关dojo.style的API参见这里。

在下一篇文章中你想看到些什么？我打算再深入讨论一下Base的本质，不过我也知道不少朋友期待看到部件（widget）的实际应用。请大家踊跃把自己的要求写在下面。