探析AJAX在思維導(dǎo)圖輔助系統(tǒng)的應(yīng)用

梁小鷗

（廣東工程職業(yè)技術(shù)學(xué)院，廣州 510520）

0 引言

思維導(dǎo)圖作為一種知識管理工具，將抽象的知識通過知識網(wǎng)絡(luò)圖的形式呈現(xiàn)出來，使各個知識之間的結(jié)構(gòu)關(guān)系一目了然。思維導(dǎo)圖輔助系統(tǒng)是針對思維導(dǎo)圖繪制的過程，將其關(guān)鍵字的概念、拓展進(jìn)行提示而開發(fā)的系統(tǒng)。本文就AJAX在開發(fā)思維導(dǎo)圖學(xué)習(xí)輔助系統(tǒng)中的應(yīng)用進(jìn)行闡述。

1 思維導(dǎo)圖概述

20世紀(jì)60年代英國著名心理學(xué)家托尼·巴贊創(chuàng)立了一種新的筆記方法：思維導(dǎo)圖，后來逐漸發(fā)展成為一種思維工具和學(xué)習(xí)方法。思維導(dǎo)圖通過繪圖的方式將思維過程可視化，以知識網(wǎng)絡(luò)的形式呈現(xiàn)出來，加深印象的同時又能全面掌握知識的整體架構(gòu)。

2 AJAX技術(shù)

AJAX（Asynchronous JavaScript and XML）即異步的JavaScript和XML，是使用JavaScript和XML實(shí)現(xiàn)異步數(shù)據(jù)傳輸?shù)募夹g(shù)。AJAX并不是新的技術(shù)，而是CSS、XHTML、DOM、JavaScript、XMLHttpRequest等技術(shù)的組合。在無需重新加載整個網(wǎng)頁的情況下，通過AJAX異步調(diào)用的方式向服務(wù)器傳送數(shù)據(jù)，再從服務(wù)器取得數(shù)據(jù)，從而實(shí)現(xiàn)對網(wǎng)頁局部進(jìn)行更新的功能。AJAX在減輕服務(wù)器負(fù)擔(dān)的同時，使客戶端無需等待服務(wù)器返回結(jié)果，便可繼續(xù)進(jìn)行別的請求，節(jié)省了時間并提高了效率。

AJAX的工作原理是在客戶端和服務(wù)器之間加了—個中間層（AJAX引擎），使用戶操作與服務(wù)器響應(yīng)異步化，如圖1所示。當(dāng)用戶向服務(wù)器請求進(jìn)行數(shù)據(jù)交互時，部分?jǐn)?shù)據(jù)可以交給AJAX引擎來處理，只有必須從服務(wù)器讀取的新數(shù)據(jù)才由AJAX引擎代向服務(wù)器進(jìn)行數(shù)據(jù)交互，服務(wù)器也只需返回這部分的處理結(jié)果。JavaScript中專門負(fù)責(zé)異步調(diào)用，與服務(wù)器通信的這部分程序，我們稱之為AJAX引擎。

圖1 AJAX工作原理圖

3 思維導(dǎo)圖輔助系統(tǒng)中AJAX技術(shù)的應(yīng)用

3.1 思維導(dǎo)圖輔助系統(tǒng)的介紹

思維導(dǎo)圖輔助系統(tǒng)是對用戶輸入的某個知識點(diǎn)進(jìn)行的知識拓展，從而輔助完成思維導(dǎo)圖的繪制。思維導(dǎo)圖知識點(diǎn)的拓?fù)鋱D繪制，分為知識點(diǎn)的向右拓展和向左拓展兩種方向。向右拓展是指：對當(dāng)前知識點(diǎn)再次劃分延展所得知識點(diǎn)，即生成子節(jié)點(diǎn)，顯示在思維導(dǎo)圖中當(dāng)前知識點(diǎn)的右側(cè)；向左拓展是指：對當(dāng)前知識點(diǎn)總結(jié)歸納所得知識點(diǎn)，顯示在思維導(dǎo)圖中當(dāng)前知識點(diǎn)的左側(cè)，即生成父節(jié)點(diǎn)。為了保證思維導(dǎo)圖的可讀性，每個知識點(diǎn)的父節(jié)點(diǎn)只能選一個。具體思維導(dǎo)圖輔助系統(tǒng)繪制效果如圖2所示。

圖2 思維導(dǎo)圖輔助系統(tǒng)繪制效果圖

思維導(dǎo)圖輔助系統(tǒng)采用了MVC架構(gòu)，通過模型（model）、視圖（view）、控制器（controller）將業(yè)務(wù)邏輯、數(shù)據(jù)、界面顯示分離，其中視圖和控制器包含在業(yè)務(wù)應(yīng)用層，模型包含在數(shù)據(jù)層。通過MVC模式使得控制器和視圖各自的功能劃分清晰，降低了模型、控制器、視圖之間的耦合度，提高了系統(tǒng)代碼的可重用性和開發(fā)效率。

思維導(dǎo)圖輔助系統(tǒng)重點(diǎn)在于知識點(diǎn)的拓?fù)鋱D繪制和知識點(diǎn)的拓?fù)涮崾緝蓚€部分，所涉及的數(shù)據(jù)表主要是思維導(dǎo)圖結(jié)構(gòu)表tb_mind和思維導(dǎo)圖數(shù)據(jù)表tb_data，其表結(jié)構(gòu)分別如表1、表2所示。

表1 思維導(dǎo)圖繪制結(jié)構(gòu)表tb_mind

表2 思維導(dǎo)圖基礎(chǔ)數(shù)據(jù)表tb_mind

3.2 思維導(dǎo)圖輔助系統(tǒng)中AJAX的應(yīng)用

在思維導(dǎo)圖繪制過程中，用戶可以選中某個知識點(diǎn)后對其進(jìn)行向右或向左拓展，思維導(dǎo)圖輔助系統(tǒng)則會對當(dāng)前知識點(diǎn)進(jìn)行拓展提示。例如圖2中，用戶針對“網(wǎng)絡(luò)互連設(shè)備”知識點(diǎn)選擇向左拓展提示進(jìn)行參考，系統(tǒng)則會在思維導(dǎo)圖基礎(chǔ)數(shù)據(jù)表（tb_data）中將該知識點(diǎn)的父節(jié)點(diǎn)名稱查詢出來，在頁面左下方為用戶進(jìn)行提示，AJAX引擎在其中完成數(shù)據(jù)間的交互工作。主要代碼如下：

向左拓展提示中的某個選項(xiàng)被選中后，思維導(dǎo)圖繪制結(jié)構(gòu)表（tb_mind）會馬上更新其相關(guān)信息，思維導(dǎo)圖輔助系統(tǒng)呈現(xiàn)的繪制內(nèi)容也會隨之變更，主要代碼如下：

4 結(jié)語

從思維導(dǎo)圖輔助系統(tǒng)的設(shè)計中可以看出，AJAX技術(shù)在繪制思維導(dǎo)圖過程中發(fā)揮了數(shù)據(jù)交互傳輸?shù)膬?yōu)勢，在無需等待的情況下，采用異步方式進(jìn)行數(shù)據(jù)傳輸，將知識點(diǎn)的拓展提示、概念解釋等信息即時展現(xiàn)給用戶，避免了傳統(tǒng)用表單form方法把整個頁面進(jìn)行提交的過程，提升了用戶體驗(yàn)，節(jié)省了網(wǎng)絡(luò)帶寬和網(wǎng)絡(luò)資源，使得思維導(dǎo)圖輔助系統(tǒng)更輕便、簡潔。