Dojo 应用程序的组成部分

Index HTML 文件

HTML 页面是每个 Web 应用程序的基础，Dojo 应用程序也不例外。传统上，单个 index.html 文件充当应用程序的入口点以及 DOM 中应用程序整体结构的根容器。

Dojo 应用程序通常被注入到单个 DOM 元素中，默认情况下是 document.body。这使得 Dojo 应用程序可以轻松地与页面上的其他内容共存 - 静态资产、传统应用程序甚至另一个 Dojo 应用程序。

小部件是 Dojo 对 DOM 元素的类比，是 Dojo 应用程序中封装的核心概念。就像传统网站通过 DOM 元素的层次结构构建一样，Dojo 应用程序通过小部件的层次结构构建。

小部件代表从单个 UI 元素（如标签或文本框）到更复杂的容器（可能代表表单、页面或整个应用程序）的所有内容。

同样，并非 DOM 中的所有元素都对用户可见，Dojo 小部件并不仅仅专注于提供用户界面，还可以满足任何幕后需求以实现应用程序功能的全部范围。

请参阅创建 Dojo 小部件参考指南，了解如何在应用程序中创建小部件。

Dojo 小部件可以表示为渲染函数工厂或 TypeScript 类，并且通常包含在单个 TypeScript 模块中。该模块封装了构成小部件的大部分内容，包括其行为和在虚拟化 DOM 中的语义表示。

小部件通过属性接口为外部使用者提供 API。此接口既充当渲染小部件时可以注入到小部件中的状态字段列表，也充当小部件需要在事件（如状态更改）发生时通知应用程序其他部分时可以调用的任何函数。

小部件的演示性样式通过 CSS 处理，类似于常规 HTML 元素的样式。CSS 模块用于封装单个小部件的演示性关注点，并避免与可能使用类似 CSS 类名的其他小部件发生冲突。

小部件可以像任何其他 TypeScript 导入一样导入其 CSS 模块，允许它们通过对象属性引用其 CSS 类名，这些属性可以在开发人员的 IDE 中自动完成。这些属性名称可用于在声明小部件的语义元素结构时指定样式类。因此，可以在构建时识别小部件与其样式之间的 CSS 类名不匹配。

虽然小部件可以通过其相应的 CSS 模块完全封装自己的样式，但通常需要一些灵活性。小部件可以在应用程序中以不同的配置使用，每个配置都有其独特的演示性需求。Dojo 支持覆盖特定样式以满足这些需求。

为了支持整个应用程序的一致呈现，可以通过主题进一步控制小部件样式。

请参阅 Dojo 样式和主题参考指南，了解有关如何设置单个小部件样式的更多详细信息。