初学dojo，做个笔记。因为dojo的相关文档很少，官方的写的也很凌乱。 全部的代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Sample 1.0.0 xdomain page</title>
<script type="text/javascript"
djConfig="isDebug: true, parseOnLoad: true"
src="http://o.aolcdn.com/dojo/1.0.0/dojo/dojo.xd.js"></script>
<script type="text/javascript">
dojo.require("dijit.form.Button");
dojo.require("dijit.InlineEditBox");
dojo.require("dijit.form.TextBox");
Commands = {
sayHello: function(){
var status = "Button Clicked at time: " + (new Date());
dojo.byId("output").innerHTML = status;
console.debug(status);
}
}
dojo.addOnLoad(function(){
dojo.connect(dojo.byId("testButton"), "onclick", Commands, "sayHello");
new dijit.form.Button({ "class": "large", label:"wokao",onClick:foo }, dojo.byId("id1"));
new dijit.InlineEditBox({onChange:myHandler, autoSave:false},
dojo.byId("id2"));
});
</script>
<script type="text/javascript">
function foo(){
console.debug("click foo");
}
function myHandler(idOfBox, value) {
console.debug("Edited value from "+idOfBox+" is now "+value);
}
</script>
<style type="text/css">
@import "http://o.aolcdn.com/dojo/1.0.0/dijit/themes/tundra/tundra.css";
@import "http://o.aolcdn.com/dojo/1.0.0/dojo/resources/dojo.css";
</style>
</head>
<body>
<h1>Sample Dojo 1.0.0 xdomain page</h1>
<p>
<button id="testButton">Click Me</button>
</p>
<p id="output">
</p>
<button dojoType="dijit.form.Button" id="helloButton">Hello World!</button>
<span id="id1"></span>
<h3 id="editable" autosave="false"
dojoType="dijit.InlineEditBox" title="h3 example"
onChange="myHandler(this.id,arguments[0])">
Edit me - I trigger the onChange callback
</h3>
<span id="id2">programatic InlineEditBox</span>
</body>
</html>
第一种是HTML的产生方式。
第二种是使用dojoType的方式。可将这种方式是基于标准HTML的一种扩展，也是一种静态的方式。
<button dojoType="dijit.form.Button" id="helloButton">Hello World!</button>
跟Tapestry有点类似，其优点是一般的图形化的html编辑器也可以对其进行编辑。对于这种方式，需要在dojo的配置里面设置“parseOnLoad: true”。
第三种是使用编程的方式（programmatically），把属性的值统一的传给构造函数。
new dijit.form.Button({ "class": "large", label:"wokao",onClick:foo }, dojo.byId("id1"));
分享到：
相关推荐
Dojo 的模块化系统基于AMD（Asynchronous Module Definition）规范，这是一种异步加载模块的方式，它允许脚本在不阻塞页面渲染的情况下按需加载。这种机制对于构建大型、复杂的Web应用非常有益，因为它可以显著提高...
Dojo 是一个强大的JavaScript工具库，它为Web开发提供了丰富的功能和组件，包括DOM操作、事件处理、动画效果、模块管理以及数据存储等。本文将通过一系列实例，帮助初学者快速掌握Dojo的核心概念和使用方法。 首先...
本话题主要聚焦于如何利用Dojo创建自定义的Widget，这是一个对于提高代码复用性和应用可维护性至关重要的技术。 Dojo的Widget系统是其核心特性之一，它允许开发者将HTML模板、CSS样式和JavaScript逻辑封装在一起，...
Dojo框架是一个强大的JavaScript库，它为Web开发提供了丰富的功能，包括UI组件、数据管理、AJAX通信以及模块化开发支持。本教程将深入探讨Dojo框架的使用，帮助开发者更好地理解和应用这一工具。 首先，从`dojo-...
Dojo 是一个强大的JavaScript库，特别设计用于构建富互联网应用程序（RIA）。这个框架全面地涵盖了前端开发所需的各种功能，包括DOM操作、事件处理、动画效果、数据存储以及Ajax通信等。Dojo 的核心优势在于其模块化...
在本例中，`dojo.connect` 的第三个参数被设置为对象 `obj`，这样在事件处理函数 `sayHello` 中，`this` 将指向 `obj` 对象，而非默认的全局对象。 #### 六、Ajax 请求：`dojo.xhrGet` Dojo 也提供了一个简洁的...
dojo JavaScript框架是Web开发中的一个强大工具，特别在处理Ajax（Asynchronous JavaScript and XML）请求时，它提供了丰富的功能和高效的性能。Dojo的核心在于它的模块化系统，这使得开发者可以方便地导入和管理所...
在"Ajaxapp"这个实例中，很可能是演示了如何结合使用DWR和Dojo来创建一个基于Ajax的应用。可能包含了使用Dojo创建交互式的前端界面，以及通过DWR实现前后端数据交换的代码示例。学习这个实例可以帮助你理解这两个...
在Dojo 1.9中，值得注意的一个变化是Dojo Core 和Dijit 之间的分离，使得开发者可以根据需求更灵活地选择引入组件。`dojo/ready`函数确保在DOM加载完成和模块加载后执行代码，是启动应用的常用入口点。 总之，...
- **dojo/store**：数据存储抽象层，提供了一种统一的方式来处理不同来源的数据，如内存、Ajax、JSONP等。 **3. 学习Dojo的资源** - **官方文档**：Dojo的官方文档非常详尽，包含了API参考、教程、示例等内容，是...
AMD规范是一种在浏览器环境中异步加载和定义JavaScript模块的方式。它允许模块和其依赖项并行加载，提高页面加载速度。Requirejs是AMD规范的主要实现者之一。 ### 使用Requirejs加载Dojo 1. **配置Requirejs**：...
这个压缩包包含了你在学习Dojo时可能需要用到的各种资源，旨在提供一个完整的开发环境，同时也作为一种备份手段。现在，让我们深入了解一下Dojo工具包的核心知识点。 Dojo是开源的JavaScript框架，由Dojo ...
【标题】"AJAX之Dojo实现登陆框"主要涵盖了使用Dojo工具包来构建一个基于AJAX技术的登录界面的知识点。...在实践中，还需要结合前端验证、后端安全措施以及用户体验设计来创建一个完整的登录系统。
例如，`dijit/form/Button`就是一个常用的组件，可以轻松地在网页上添加交互式按钮。 在数据管理方面，Dojo的`dojo/data`模块提供了多种数据存储模型，如ItemFileReadStore和ItemFileWriteStore，用于与服务器进行...
AccordionContainer 是 Dojo Toolkit 提供的一种布局容器，用于创建手风琴式的可折叠面板。用户可以通过点击标题来展开或收起相应的面板内容。默认情况下，AccordionContainer 在点击标题时会切换面板的状态（即展开...
例如，`dijit/form/Button`用于创建按钮，`dijit/layout/BorderContainer`用于创建响应式布局。 3. **DOJO数据处理** DOJO的数据管理主要由dojo/store模块提供，它支持多种数据存储模型，如内存存储、JSONP请求、...
这段代码首先引入了`dojo.js`，然后通过`require`加载了`parser`和`Button`模块，解析页面上的Dojo标记，并创建了一个按钮。 总之，Dojo 1.5.0为Web开发提供了强大且灵活的工具，结合其模块化、组件化、测试框架...
在这个例子中，我们首先引入了DOJO库，然后使用`require`函数加载了`dijit/form/Button`模块和`dojo/domReady!`模块。`Button`模块用于创建按钮，而`domReady!`确保在DOM加载完成后执行代码。当按钮被点击时，`...
**DOJO 框架详解** DOJO 是一个开源的 JavaScript 库，它提供了...通过这个“DOJO-DEMO 官网提取版”，你将有机会亲手实践这些知识点，加深理解并熟练掌握 DOJO 框架的精髓，从而在实际项目中发挥出 DOJO 的强大功能。
Dojo是Web开发中的一个强大工具集，由Dojo基金会创建，旨在提供一套完整的前端开发解决方案，包括UI组件、数据管理、动画效果、AJAX交互以及模块化开发等。 Dojo的核心概念是模块化。它采用了AMD（Asynchronous ...