梁小鷗

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

0 引言

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

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

20世紀(jì)60年代英國(guó)著名心理學(xué)家托尼·巴贊創(chuàng)立了一種新的筆記方法：思維導(dǎo)圖，后來(lái)逐漸發(fā)展成為一種思維工具和學(xué)習(xí)方法。思維導(dǎo)圖通過(guò)繪圖的方式將思維過(guò)程可視化，以知識(shí)網(wǎng)絡(luò)的形式呈現(xiàn)出來(lái)，加深印象的同時(shí)又能全面掌握知識(shí)的整體架構(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ú)需重新加載整個(gè)網(wǎng)頁(yè)的情況下，通過(guò)AJAX異步調(diào)用的方式向服務(wù)器傳送數(shù)據(jù)，再?gòu)姆?wù)器取得數(shù)據(jù)，從而實(shí)現(xiàn)對(duì)網(wǎng)頁(yè)局部進(jìn)行更新的功能。AJAX在減輕服務(wù)器負(fù)擔(dān)的同時(shí)，使客戶端無(wú)需等待服務(wù)器返回結(jié)果，便可繼續(xù)進(jìn)行別的請(qǐng)求，節(jié)省了時(shí)間并提高了效率。

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

圖1 AJAX工作原理圖

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

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

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

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

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

思維導(dǎo)圖輔助系統(tǒng)重點(diǎn)在于知識(shí)點(diǎn)的拓?fù)鋱D繪制和知識(shí)點(diǎn)的拓?fù)涮崾緝蓚€(gè)部分，所涉及的數(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)圖繪制過(guò)程中，用戶可以選中某個(gè)知識(shí)點(diǎn)后對(duì)其進(jìn)行向右或向左拓展，思維導(dǎo)圖輔助系統(tǒng)則會(huì)對(duì)當(dāng)前知識(shí)點(diǎn)進(jìn)行拓展提示。例如圖2中，用戶針對(duì)“網(wǎng)絡(luò)互連設(shè)備”知識(shí)點(diǎn)選擇向左拓展提示進(jìn)行參考，系統(tǒng)則會(huì)在思維導(dǎo)圖基礎(chǔ)數(shù)據(jù)表（tb_data）中將該知識(shí)點(diǎn)的父節(jié)點(diǎn)名稱(chēng)查詢出來(lái)，在頁(yè)面左下方為用戶進(jìn)行提示，AJAX引擎在其中完成數(shù)據(jù)間的交互工作。主要代碼如下：

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

4 結(jié)語(yǔ)

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