掌握Dojo工具包，第6部分:Dojo Widget的高级应用

掌握Dojo工具包，第6部分:Dojo Widget的高级应用2010-07-04 IBM 蒋贤礼牟磊谢福生Dojo Widget 是 Dojo 极为重要的部分，因此在对 Dojo Widget 有了全面的了解以后，还应该加强对其使用机制的掌握。

创建 Dijit 的两种方式

Dojo 提供了两种方式给系统开发者去使用其所提供的 Dijit（Dijit 是 Dojo Widget 的简称）。第一种方法是通过直接在页面中静态的写入带有 Dijit 属性的标签去实现该 Dijit 的使用；第二种方法是通过 Javascript 语句，动态的在当前使用页面中生成 Dijit。

第一种方法被称为静态创建 Dijit，而第二种方法则被称为动态创建 Dijit。

静态创建 Dijit

静态创建 Dijit 是通过 HTML 标签属性的方式将 Dijit 引入页面的。因此静态创建 Dijit 的方法简单方便，对于初学使用者也无任何认知困难。在页面需要使用 Dijit 的时候，静态创建 Diijt 往往成为其首选。

静态创建 Dijit 分为三个步骤来完成。

第一步，确定要使用 Dijit 的对象名全称。例如，如果想使用 Dijit 按钮，其对象名全称为 dijit.form.Button。

第二步，在页面的“<head>”和“</head>”标签之间引入即将使用的 Dijit 模块。例如，如果想使用 Dijit 按钮，则需在该页面的 head 部分引入 Dijit 按钮模块。

清单 1.静态创建 Dijit 示例

<script type="text/javascript">
 dojo.require（"dojo.parser"）;
 dojo.require（"dijit.form.Button"）;
 </script>

dojo.require（“dijit.form.Button”）表示在页面中引入 Dijit 按钮模块。dojo.require（“dojo.parser”）表示在页面中引入解析 Dijit 标签属性的功能模块。

静态创建 Dijit 所使用的 Dijit 标签属性不是标准的 HTML，浏览器不能直接对其进行解析。因此需要 dojo.parser 在页面加载完成以后，对整个页面的所有 Dijit 标签属性进行解析，将其转换为浏览器可以识别的标记。

第三步，在页面中需要使用 Dijit 的位置，写入 Dijit 标签属性。例如，如果使用 Dijit 按钮，则为 <div dojotype=“dijit.form.Button”>OK</div>。

动态创建 Dijit

静态创建 Dijit 简单易用，但灵活性差，无法满足实际情况下多变的要求。因此在大多数情况下，更多的是需要动态创建 Dijit。

例如，需要根据用户的选择，动态的创建一定数目一定类型的 Dijit；或者是在页面生成后根据后台运算结果动态的创建 Dijit。

动态创建 Dijit 也分为三个步骤来完成。

第一步，明确要动态创建 Dijit 的对象名全称。

第二步，引入即将使用的 Dijit 模块。例如，如果想使用 Dijit 按钮，则需在该页面的 head 部分引入 Dijit 按钮模块。

清单 2.动态创建 Dijit 示例 1

<script type="text/javascript">
 dojo.require（"dijit.form.Button"）;
 </script>

需要注意的是，清单 2 中没有引入 dojo.require（“dojo.parser”）。因为动态创建 Dijit 的过程中会自动完成向 HTML 的转换。