Dojo開發（一）
Dojo Toolkit 簡介
Dojo 於 2004 年建立，使開發 DHTML 和 JavaScript web 應用程式開發流程更為容易，隱藏了很多現代 web 瀏覽器中普遍存在的跨瀏覽器矛盾。這使重點放在實現功能上，而不是調整程式碼使其在每個瀏覽器上執行。Dojo 屬於 Dojo 基金會，該基金會是 Russell 和 Dylan Schiemann 於 2005 年建立的。Dojo 是一個開源軟體（OSS），有雙重許可，Academic Free License (AFL) 和一個修改的 BSD 許可，您可以選擇遵守一個。
特性一瞥
Dojo Toolkit 的特性可以分到 4 個不同部分。這種劃分使得開發人員可以將庫大小保持到最小，確保應用程式效能不受大量 JavaScript 庫下載的影響。例如，如果您只需要 Ajax 支援效能，您只需要包含 base 包；不需要包含擴充套件的 Dijit UI 元件，在本系列中稍後您將學習更多關於 Dojo 載入不同模組的方法。
Base Base 包提供 Dojo Toolkit 的基礎，包括一些功能，比如 DOM 使用函式、CSS3 基於選擇器的 DOM 查詢、事件處理、基本的動畫、以及 Dojo 基於類的面向物件特性。本文主要介紹 Base。 Core Core 包包含一些 Base 中沒有包含的附加特性。通常，這些特性不像 Base 中的特性那樣頻繁使用；因此，它們單獨載入減輕 Base 包的負擔。從這一點上來講，Core 包提供一些實際有用的元件，包括高階動畫拖放、I/O、資料管理、國際化（i18n）、瀏覽器歷史管理。Core 包不再本文範圍之內。 Dijit Dijit 包包含 Dojo 小部件和元件的擴充套件 UI 庫。這些小部件的一些示例包括對話方塊、日曆、調色盤、工具提示和樹。它也包括一些表單控制元件，這比標準 HTML 表單控制元件提供更多的功能，還有一些完整的佈局管理選項。本系列的第 3 部分將深入介紹 Dijit 特性。 DojoX Dojo eXtensions (DojoX) 包含工具箱的各個子專案。位於 DojoX 中的大多數是實驗特性，但是也有一些穩定元件和特性。DojoX 將在本系列的第 3 部分做一簡要介紹。
載入Dojo
建立 Dojo 最簡單的方法是從一個 Content Delivery Network (CDN) 提供它，這將從附近的客戶機器上傳遞 Dojo JavaScript 檔案，而不是從您自己的伺服器上。 這不僅有助於加速指令碼載入，也意味著使用者從其他網站載入 Dojo 檔案的機會有所增加，這使得它們從快取中載入，進一步提高了載入速度。
在本系列中，假設您使用的是 Dojo 1.5，儘管任何 1.x 版本都是可相容的。包含在您的 HTML 頁面中的以下 <script> 標記將從 Google 的 CDN 中下載 Dojo 1.5：
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script>
另外，您可以下載 Dojo 到您自己的伺服器上，然後從那裡載入它。我的首選方法是從一個 CDN 載入，同時有一個本地副本在 CDN 伺服器出現問題時作為後備。為了做到這一點，下載 Dojo 並將檔案放在一個相對於儲存您的 web 目錄比較合適的位置。假設從您 web 目錄到 Dojo 指令碼檔案的相對路徑是 “script/”，清單 1 中的程式碼將首先從 CDN 載入 Dojo，如果失敗，則載入本地版本。
清單 1. 使用本地回退從 CDN 載入 Dojo
<script src="https://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js">
</script>
<script>
typeof(dojo) === "undefined" && document.write(unescape('%3Cscript
src="js/libs/dojo-1.5.min.js"%3E%3C/script%3E'))
</script>
有一點很重要，將以 typeof(dojo) 開頭的程式碼放在一行；否則，它將不能執行。如果您想測試副本是否起作用，只需要註釋掉從 CDN 載入的這一行，然後使用 “Hello, World!” 示例（幾分鐘內就可以建立）測試您的頁面即可。
Dojo Hello World示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Dojo Hello World入門</title>
</head>
<body>
<!-- 從cdn載入dojo.js -->
<script src="https://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script>
<script>
// DOM 載入完成後觸發
dojo.addOnLoad(function(){
dojo.create("div",{
"innerHTML":"Hello World! HuangBaoKang"
},dojo.body());
});
</script>
</body>
</html>
瀏覽器執行效果圖：
