所有的基于dijit的widget共同父类为dijit._Widget,由于javascript先解析父类在解析继承的子类javascript继承机制,dojo机制下的所有widget会按照以下顺序完成自身js对象生成以及dom对象的渲染。
1) postscript
2) create
3) postMixInProperties
4) buildRendering
5) postCreate
6) startup
在解析widget时,dojo会生成一个新建一个widgetset对象dojo.registry用来管理widget,dojo.registry中的属性_hash用来保存widget,如果widget有id这个属性可以通过dojo.registry.add(widget)方法将widget放到_hash中,如果没有id或者id重复,这也是id在html中必须设置的原因。接下来我们就可以使用dijit.byId(也就是dojo.registry.byId)获取widget的js对象。
这个地方的代码为。
// dijit.WidgetSet包含所有拥有唯一id的widget对象
dojo.declare("dijit.WidgetSet", null, {
//构造器,初始化this._hash
constructor: function(){
// summary:
// A set of widgets indexed by id
this._hash={};
},
//注册,id冲突会失败
add: function(/*Widget*/ widget){
if(this._hash[widget.id]){
throw new Error("Tried to register widget with id==" + widget.id + " but that id is already registered");
}
this._hash[widget.id]=widget;
},
//根据id移除
remove: function(/*String*/ id){
delete this._hash[id];
},
//通过这个可以遍历现有的widget
forEach: function(/*Function*/ func){
for(var id in this._hash){
func(this._hash[id]);
}
},
//通过此方法可以查询到满足条件的widget集合
filter: function(/*Function*/ filter){
var res = new dijit.WidgetSet();
this.forEach(function(widget){
if(filter(widget)){ res.add(widget); }
});
return res; // dijit.WidgetSet
},
//根据id获取widget对象
byId: function(/*String*/ id){
return this._hash[id];
},
//可以获取同一类型的widget
byClass: function(/*String*/ cls){
return this.filter(function(widget){ return widget.declaredClass==cls; }); // dijit.WidgetSet
}
});
dijit.registry = new dijit.WidgetSet(); //dijit.registry用来管理widget对象
分享到:
相关推荐
Dojo 控件的生命周期主要由 `dijit._Widget` 类定义,它是所有dijit组件的基础。dijit._Widget 实现了模板方法设计模式,以管理组件的生命周期。生命周期中的关键方法包括: 1. `create()`: 这个方法定义了组件的...
Extract files from the download locally or on a web server. Include ...Browse to dojo/tests/runTests.html or dijit/themes/themeTester.html to see Dojo in action
Dojo的核心组件是Dijit,它提供了一系列可复用的UI小部件,使得开发者能够快速地创建出高质量、符合无障碍标准的用户界面。在这个"Dojo小部件开发演示"中,我们将深入探讨如何使用Dijit来开发自定义的小部件,结合...
Dijit是Dojo Toolkit的一部分,专门提供了一系列可复用的UI控件,其中包括我们关注的“dijit.tree”,即树形列表。在本篇文章中,我们将深入探讨这五个关于dijit.tree的例子,并了解如何在实际应用中实现它们。 1. ...
第二层是基于核心API的“控件生命周期”概念。这是Dojo的一个亮点,它允许第三方开发者按照标准方式创建自定义控件,确保了控件的高度内聚性和面向对象的特性。每个Dojo控件都是一个JavaScript类,通常继承自_Widget...
- **dijit.forms**:表单控件相关的Widget。 - **dijit.layout**:页面布局Widget。 - **dojox.charting**:统计图表工具包。 #### 使用Dojo进行开发 使用Dojo开发Web应用非常直观,只需将`dojo.js`作为普通JS模块...
dijit-分页-js 0.2 用于分页的 Dijit 描述 这个 Dojo 小部件在您选择的 DOM 元素中呈现一个分页列表,以便您可以轻松地对结果进行分页。 入门 将 dojo 配置添加到您的 HTML 头中 < script > // host path ...
这个包下载包含了四个主要的文件目录:dijit、dojo、dojox 和 util,这些都是Dojo框架的核心部分。 1. **dojo**: 这是Dojo框架的基础模块,包含了许多核心功能,如模块加载(AMD, Asynchronous Module Definition)...
在IT领域,treeview控件是一种常见的用户界面元素,它用于以树形结构展示数据,使得用户可以方便地浏览和操作层级关系的数据。本篇将详细探讨dojo库中的treeview控件,以及如何利用它来实现功能完备的树视图。 Dojo...
在IT行业中,地理信息系统(GIS)是一个至关重要的领域,它涉及到地图制作、空间数据分析和决策支持。ArcGIS是Esri公司推出的一款强大的GIS软件,它提供了丰富的开发接口,包括ArcGIS for JavaScript,允许开发者...
在这个场景中,我们关注的是两个JavaScript库——dstore和Dijit。dstore是一个强大的数据存储库,而Dijit是Dojo Toolkit的一部分,提供了一系列的UI小部件。两者结合,可以方便地实现模型与视图之间的数据同步。 ...
道场/Dijit 图标 我一直无法找到可用的 Dojo/Dijit 按钮图标图像及其各自类的,所以我编译了。 常规图标的使用如下所示: <button data-dojo-type="dijit/form/Button" data-dojo-props="iconClass: 'NAME_OF_...
3. **Dijit**:Dijit 包是 Dojo 的扩展 UI 库,包含各种用户界面组件,如对话框、日历、调色板、工具提示、树形视图,以及增强的表单控件和布局管理选项。Dijit 提供丰富的交互体验,是构建富互联网应用的关键。 4....
"极光:DojoToolkit Dijit 的定制主题"是一个关于前端开发的专题,主要集中在使用Dojo Toolkit的Dijit组件库创建自定义主题。Dojo Toolkit是一个强大的JavaScript库,它提供了丰富的UI组件和工具,而Dijit是Dojo中的...
DIJIT X拥有DIJIT和 dojo X 所没有的东西! 开放、免费并由的好人带给您。 ##小部件###Fieldset 这是一个将引入 Dojo 的小部件。 ###AutofillCheckBox Dijit CheckBox的扩展,用于使用另一组 Dijit 小部件的值自动...
这个名为“toc-dijit-graphics-layer-test”的项目,显然与JavaScript有关,可能是针对某个GIS(地理信息系统)或地图应用的测试用例。Dijit是Dojo Toolkit的一部分,它是一个用于构建交互式Web应用的JavaScript库。...
Dojo 提供了一套完整的 UI 控件,如按钮(`dijit/form/Button`)、下拉列表(`dijit/form/Select`)、布局容器(`dijit/layout/BorderContainer`)等。这些控件基于 dojo/_base/xdom 和 dojo/dom-class 等模块,实现...
3. **Dijit**:Dijit是Dojo的UI组件库,提供了多种可复用的、样式化的用户界面元素,如按钮、表单、对话框等。在1.3.1中,Dijit的可访问性和国际化支持得到了加强。 4. **Dojo Data**:这是一个数据模型接口,用于...
Dijit Claro 手写笔转换 该存储库包含 Dijit 的 Claro 主题(从 Dojo 版本 1.10.4 开始)从到一个端口。 注意:早期 Dojo 版本(回到 1.7)的转换可在单独的分支上获得: 用法 确保已安装手写笔... npm install -...
- `dijit.byId`:获取 Dojo 控件对象。 - `XSP.getElementById`:客户端访问 Xpage 控件。 - `getComponent`:服务器端访问控件。 ### 4. Xpage VS 表单 Xpage 相比传统的表单提供了更丰富的界面和交互能力,更适合...