2006年初，dojo还是0.22的时候就很关注它的发展，可一直没有在实际项目中使用。一来是由于文档的缺少，而来是dojo的相关介绍总是让人望而生畏。
到现在都如此，第一个hello world就搞了一大堆东西，比如widget组件，自定义的script标签等，加上要引入什么css文件，djConfig、dojo.require等等，让人很迷惑，这么复杂，到底dojo该怎么使用呢？
我只是想把dojo当作一个普通的js类库，就像prototype那样？OK，闲话少说，来看看如何使用dojo。
第一步，引入dojo.js
dojo的发行包里有4个子目录，要引入的文件是名叫"dojo"的子目录里的dojo.js。 假设你是这样的目录结构:
| project | +--dojo-lib | | | +--dijit | +--dojo | +--dojox | +--util | +--dojo_hello_world.html |
| <script type="text/javascript" src="./dojo-lib/dojo/dojo.js"></script> |
开始使用dojo
现在开始使用dojo的第一个函数:dojo.byId ，dojo.byId就等同于常用的document.getElement 。
| <input type="text" name="username" id="username" value="Mark" /> <script type="text/javascript"> var username = dojo.byId('username').value alert(username); </script> |
OK，是不是和普通的js库一样，没有任何玄机？
dojo.addOnLoad
现在我们想在window.onload里面处理一点东西，就像Ext.onReady，这个东西在dojo里叫做dojo.addOnLoad。
| dojo.addOnLoad(function(){ var username = dojo.byId('username').value alert(username); }); |
dojo.connect
OK，window.onload搞定了，那么如何监听普通的dom事件呢？没问题，强大的dojo.connect出场。
| <script type="text/javascript"> function sayHello(event) { alert("Hello"); } dojo.addOnLoad(function(){ var btn = dojo.byId('hello'); dojo.connect(btn,"onclick",sayHello); }); </script> <input type="button" id="hello" value="Hello" /> |
是不是和prototype的Event.observe($('btnAdd'), "load", doAdd)差不多? 用prototype时最烦的就是那个长长的bindAsListener了，使用dojo.conncect，可以在第三个参数中指定当前的scope：
| var name = "Mark" function sayHello() { alert("Hello " + this.name); } var obj = { name: "Karl" } dojo.addOnLoad(function(){ var btn = dojo.byId('hello'); dojo.connect(btn,"onclick",obj,sayHello);//注意这行的第三个和第四个参数 }); |
OK，点击按钮，将输出：Hello Karl。这里dojo.connect的第三个参数变成了scope，而handler函数是第四个，实际上dojo.connect(btn,"onclick",sayHello); 与dojo.connect(btn,"onclick",null,sayHello); 相同。
更加复杂的用法这里不作介绍，写太多就越搞越复杂了，后面再写文章详细介绍dojo.connect，这里只简单介绍如何绑定DOM事件。
本文转自左正博客园博客，原文链接：http://www.cnblogs.com/soundcode/archive/2011/07/26/2117547.html，如需转载请自行联系原作者
