Dojo is a collection of JavaScript utilities providing solutions for a vast array of problems faced by the professional JavaScript developer. This reference guide provides information on the following:
There are some additional resources within this reference guide as well:
The base functionality of the Dojo Toolkit is provided by just including dojo.js. This includes tons of features like CSS-based queries, event handling, animations, Ajax, class-based programming, and a package system that makes getting access to the rest of Dojo a snap.
An example doing a basic animation
require(["dojo/query", "dojo/_base/fx", "dojo/_base/connect", "dojo/domReady!"],
function(query, baseFx, conn){
query("#showMe").on("click", function(e){
var node = this,
anim = baseFx.anim(node, {
backgroundColor: "#363636",
color: "#f7f7f7"
}, 1000);
conn.connect(anim, "onEnd", function(){
baseFx.anim(node, { color: "#363636" }, null, null, function(){
node.innerHTML = "wow, that was easy!";
baseFx.anim(node, { color: "white" });
});
});
});
});
<div id="showMe" style="padding: 10px;">click here to see how it works</div>
Checkout the full contents of the Dojo modules.
Additional stable (but optional) components for advanced animations, I/O, data, Drag and Drop and much more.
An example using a built in module dojo/fx/easing
require(["dojo/query", "dojo/_base/fx", "dojo/fx/easing", "dojo/domReady!"],
function(query, baseFx, easing){
query("#showMe2").on("click", function(e){
baseFx.animateProperty({
node: e.target,
properties: {
marginLeft: 200
},
easing: easing.elasticOut,
duration: 1200,
onEnd: function(n){
baseFx.anim(n, { marginLeft: 2 }, 2000, easing.bounceOut);
}
}).play();
});
});
<div id="showMe2" style="padding: 10px; margin-left:2px;">
Click to Animate me with built in easing functions.
</div>
Dijit is Dojo's theme-able, accessible (i18n, l10n), easy-to-customize UI Library. Dijit requires Dojo Base and various Dojo Core modules to use.
DojoX contains a number of sub-projects based on Dojo Base. Once can consider these projects Dojo eXtensions or eXperiments. Each project has a varying states of maturity -- from very stable and robust, to alpha and eXperimental. All DojoX projects, at the least, contain README files that outline their maturity and authorship, so be sure to check those along with the documentation pages to get the full picture of where a module is headed.
Visit the DojoX Reference Index to begin the adventure.
Dojo ships a number of additional utility projects for internal use and general user consumption. The various utilities are outlined in their respective pages: