在工作中涉及到了web頁面和底層互動問題，這裡做下簡單回顧。
本文基於hisi方案分析web介面整體架構。

頁面初始化流程：

呼叫hsan.init(param,callback) 初始化，主要配置config.js中的資料到hsan物件。接著呼叫回撥函式initMenu()，函式如下：

function initMenu(){
    var menu = new Menu({loadPage:"Status:Sta_Overview:SO_Overview"});
}

函式Menu(o)裡面幹了三件事：

1. 例項化父選單new Parent 。函式Parent(m,menu)會呼叫
   Element.call(this,”TD:Menu_L1_Link”) 建立一個元素，並且繫結一個onclick
   事件，而onclick函式會呼叫第二級選單的onclick函式
2. 例項化第二級選單new PannelChild 。函式PannelChild(m,menu,p)會呼叫 Element.call(this,”TD:Menu_L2_Link”) 建立一個元素，並且繫結一個onclick
   事件，而onclick函式會呼叫第三級選單的onclick函式
3. 例項化第三級選單new threeChild 。函式threeChild(m,menu,p,r) 會呼叫
   Element.call(this,”TD:Item_L2”); 建立一個元素，並且繫結一個onclick
   事件，而onclick函式會呼叫hsan.load(m.name)。Hsan.load會呼叫
   $.initPage(name) 初始化頁面。

接下來分析如何初始化頁面
$.initPage(name) 初始化頁面。
以“狀態總覽”為例子
頁面流程分析：(以“狀態總覽”為例子)

在 initPage函式裡面，
InitAppPanel(Pans[i])：每個Pans[i]建立一個”DIV”，裡面依次建立關於title的”DIV”和關於content的”DIV”。
InitAppTag(Tags[j])：根據Tags[j].type初始化頁面，Tags[j].type在config.js中定義好。

這裡以“狀態總覽”為例子，如下圖，tags表示Tags[j]，其下有type屬性info_contextone和simple_tableone，會根據info_contextone呼叫initInfoContextone(tag)，會根據simple_tableone 呼叫initSimpleTableone(tag)。

initAppFunction(tempTag,name)：顯示tag，並且呼叫第三級選單init屬性對應的函式。
裡面會呼叫.exec(.Apps[name].init)，這個函式會呼叫函式init_status_set()，可通過config.js檔案中的Applications查詢，如下圖所示：

init_status_set()：狀態總覽
函式主要乾了幾件事：
1. 使用getRequestData函式，傳送請求獲取伺服器的響應資料data
2. 呼叫nit_status_set的回撥函式function(data)，並根據data，進行資料解析
3. setAppTagData(data);把解析後的資料顯示在頁面