2006年初，dojo還是0.22的時(shí)候就很關(guān)注它的發(fā)展，可一直沒有在實(shí)際項(xiàng)目中使用。一來是由于文檔的缺少，而來是dojo的相關(guān)介紹總是讓人望而生畏。

到現(xiàn)在都如此，第一個(gè)hello world就搞了一大堆東西，比如widget組件，自定義的script標(biāo)簽等，加上要引入什么css文件，djConfig、dojo.require等等，讓人很迷惑，這么復(fù)雜，到底dojo該怎么使用呢？

我只是想把dojo當(dāng)作一個(gè)普通的js類庫(kù)，就像prototype那樣？OK，閑話少說，來看看如何使用dojo。

第一步，引入dojo.js

dojo的發(fā)行包里有4個(gè)子目錄，要引入的文件是名叫"dojo"的子目錄里的dojo.js。 假設(shè)你是這樣的目錄結(jié)構(gòu):

project | +--dojo-lib | | | +--dijit | +--dojo | +--dojox | +--util | +--dojo_hello_world.html

<script type="text/javascript" src="./dojo-lib/dojo/dojo.js"></script>

開始使用dojo

現(xiàn)在開始使用dojo的第一個(gè)函數(shù):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庫(kù)一樣，沒有任何玄機(jī)？

dojo.addOnLoad

現(xiàn)在我們想在window.onload里面處理一點(diǎn)東西，就像Ext.onReady，這個(gè)東西在dojo里叫做dojo.addOnLoad。

dojo.addOnLoad(function(){ ?var username = dojo.byId('username').value ?alert(username); });

dojo.connect

OK，window.onload搞定了，那么如何監(jiān)聽普通的dom事件呢？沒問題，強(qiáng)大的dojo.connect出場(chǎng)。

<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時(shí)最煩的就是那個(gè)長(zhǎng)長(zhǎng)的bindAsListener了，使用dojo.conncect，可以在第三個(gè)參數(shù)中指定當(dāng)前的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);//注意這行的第三個(gè)和第四個(gè)參數(shù) });

OK，點(diǎn)擊按鈕，將輸出：Hello Karl。這里dojo.connect的第三個(gè)參數(shù)變成了scope，而handler函數(shù)是第四個(gè)，實(shí)際上dojo.connect(btn,"onclick",sayHello); 與dojo.connect(btn,"onclick",null,sayHello); 相同。

更加復(fù)雜的用法這里不作介紹，寫太多就越搞越復(fù)雜了，后面再寫文章詳細(xì)介紹dojo.connect，這里只簡(jiǎn)單介紹如何綁定DOM事件。

總結(jié)

以上是生活随笔為你收集整理的dojo Quick Start/dojo入门手册--开始使用dojo.js的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。