專利名稱：：一種列表生成方法及設備的制作方法
技術領域：
：本申請涉及計算機
技術領域：
，尤其涉及一種Web應用中的列表生成方法及設備。
背景技術：
：在Web業務的應用過程中，執行搜索等業務后，需要通過列表形式展示搜索結果，列表展示形式是Web業務中的常見展示方式。目前，主要有以下兩種生成并展示列表的方式。第一種方式利用預先設定的后臺語言生成超文本標記語言(HyperTextMarkupLanguage,HTML)形式的文檔對象模型(DOM)，所述DOM中包含生成列表架構的標簽，然后將需要展示的數據寫入DOM中的列表架構中，并對寫入數據后的DOM渲染生成頁面，并將該頁面向用戶展示以達到通過列表形式展示數據的目的。在上述第一種方式下，需要展示的數據與DOM中的列表架構完全耦合，即頁面的顯示層和數據層耦合在一起，當展示的數據發生變化時，需要重新渲染并生成頁面，然后將重新生成的頁面刷新原頁面，由于展示的數據時常會發生變化，因此，在每次數據發生變化時都要重新生成并刷新頁面，使得每次重新生成頁面都要占用額外的資源，且列表展示效果較差。第二種方式采用客戶端腳本語言JavMcript應用插件創建D0M，然后利用異步JavMcript和XML(ajax)獲取數據，將獲取的數據寫入DOM生成的列表架構中，并渲染生成展示列表的頁面。在上述第二種方式下，當需要通過多個列表展示大量的數據時，JavaScript應用插件需要首先創建DOM對象，然后在后臺對該DOM進行渲染才能最終得到展示列表的頁面，由于在JavMcript應用插件生成列表的過程中，需要執行創建DOM對象的操作，導致占用的資源量較大。綜上所述，在目前生成并展示列表的方式下，如果采用第一種方式，在每次數據發生變化時都要重新生成并刷新頁面，使得每次重新生成頁面都要占用額外的資源，且列表展示效果較差，如果采用第二種方式，JavaScript應用插件需要不斷地創建DOM對象，導致系統性能下降，因此，迫切需要找到一種能夠克服上述問題的列表生成方式。
發明內容本申請的目的在于，提供一種列表生成的方法及設備，用以解決現有技術中存在每次數據發生變化時都要重新生成并刷新頁面或需要不斷地創建DOM對象，導致系統性能下降的問題。一種列表生成的方法，所述方法包括利用預先設定的后臺語言生成宏函數，所述宏函數用于表示超文本標記語言HTML形式的文檔對象模型D0M;通過客戶端腳本語言JavMcript應用插件讀取待展示的數據，并將讀取的數據寫入所述D0M，生成寫入數據后的列表。一種列表生成的設備，所述設備包括DOM生成模塊，用于利用預先設定的后臺語言生成宏函數，所述宏函數用于表示HTML形式的文檔對象模型DOM；JavMcript應用插件，用于讀取待展示的數據，并將讀取的數據寫入所述D0M;列表生成模塊，用于生成寫入數據后的列表。本申請使用后臺語言生成宏函數的方式來獲得HTML形式的D0M，避免了由JavaScript應用插件生成列表時需要執行創建DOM操作而導致系統性能下降的問題，同時，還利用JavMcript應用插件讀取數據并將讀取的數據寫入DOM的方式最終生成列表，克服了數據與列表架構完全耦合的問題，在每次展示列表時不需要刷新頁面，使列表的展示效果較好。圖1為本申請實施例一列表生成的方法步驟示意圖；圖2為本申請實施例二列表生成的設備結構示意圖。具體實施例方式本申請的方案應用于Web環境，特別是應用于Web搜索環境，用戶通過搜索引擎搜索出需要的數據后，搜索引擎將該數據存儲在后臺，然后利用本申請提供的列表生成方法以及列表生成設備生成包含存儲在后臺中的數據的列表，并將該列表以頁面形式向用戶展示ο為了實現本申請目的，本申請實施例提出的生成列表的方法以及設備是利用預先設定的后臺語言生成的宏函數來表示HTML形式的D0M，并通過Jav必cript應用插件讀取待展示的數據后，將該數據寫入所述DOM以生成列表。在本申請實施例的方式下，由于利用預先設定的后臺語言生成的宏函數直接繪制HTML形式D0M，在后臺直接渲染繪制出的D0M，避免了采用JavMcript應用插件創建列表時需要先執行創建DOM對象的操作導致該操作占用的資源量較大的問題；同時，在本申請實施例的方式下，通過JavMcript應用插件讀取待展示的數據，由于JavMcript應用插件分別讀取列表中各顯示部分中待展示的數據，在向DOM對象寫入數據時也是分別將各顯示部分中待展示的數據寫入對應的顯示部分中，因此，實現了頁面的顯示層和數據層分離，避免了需要展示的數據與DOM中的列表架構完全耦合的情況發生，在每次列表中有需要更新的數據時，只需要確定該更新的數據所在的顯示部分，然后將該更新的數據寫入其所在的顯示部分即可，不需要刷新頁面，使列表的展示效果較好。下面結合說明書附圖對本申請各實施例進行詳細描述。實施例一如圖1所示，為本申請實施例一中列表生成的方法步驟示意圖，所述方法包括以下步驟步驟101利用預先設定的后臺語言生成宏函數，所述宏函數用于表示HTML形式的DOM。本申請各實施例中涉及的后臺語言可以是任意能夠用于生成表示HTML形式的DOM宏函數的計算機語言，如Velocit模板語言(基于java的模板語言)、Java語言等。本步驟中生成的宏函數表示的DOM中包含生成列表架構的標簽，如表示列表塊狀結構的Div標簽，表示列表表格結構的Table標簽等。在本步驟中生成的DOM相當于搭建了一個HTML形式的列表架構，在通過宏函數表示DOM時，可以在該宏函數中設置列表頭、列表主體、列表行、列表表格等參數。步驟102為待寫入所述DOM中列表架構各部分的數據分別設置展示樣式。在本步驟中，列表架構的各部分可以是指列表頭部分和列表主體部分，為待寫入列表頭的數據設置展示樣式后，后續寫入的列表頭的數據將按照該展示樣式展示。列表主體部分的展示與列表頭部分的展示方式相同。本步驟中所述的展示樣式包括但不限于該列表架構部分的顯示背景色、數據展示的字體、段落、顏色等。本步驟可以是實現本申請目的的優選步驟，本申請的方案中也可以不分別設置展示樣式，按照默認的展示樣式展示寫入數據后的列表。步驟103:為待寫入DOM中的數據進行的操作設置至少一個應用編程接口(ApplicationProgramInterface，API)。在步驟102的優選步驟中，是以列表架構為單位，分別設置展示樣式的，為了給用戶提供更加多元化、細粒度的列表生成方式，在步驟103的優選步驟中，通過定義一個列表的實體類，來控制列表的行為和數據。所述對數據進行的操作包括但不限于翻頁、排序、選擇到指定行、從后往前顯示等，為每一個操作設置一個API，通過調用API的方式以滿足操作需要。步驟104通過JavMcript應用插件讀取待展示的數據。在本步驟中，待展示的數據已保存在后臺中，通過Jav必cript應用插件讀取數據。JavaScript應用插件在讀取數據時，需要確定讀取的數據是列表中哪一顯示部分中待展示的數據，以便于在下一步向DOM寫入數據時將數據寫入其所在的顯示部分中。步驟105JavaScript應用插件將讀取的數據寫入所述D0M，生成寫入數據后的列表。在本步驟中，JavMcript應用插件根據上一步驟中確定的數據所在的顯示部分，將讀取的數據寫入列表中相應的顯示部分的位置。在本步驟中，JavaScript應用插件具體地將按照所述DOM中列表結構各部分設置的展示樣式，將讀取的數據根據列表架構的標簽寫入所述DOM中列表結構的各部分，使得寫入各部分的數據最終按照設置的展示樣式展示。本實施例中涉及的顯示部分和列表架構可以表示列表中相同的部分，或是有重疊的部分，或是不相關的部分。在向用戶展示本步驟生成的列表后，可以進一步通過Jav必cript應用插件調用API，對生成的列表中的數據進行相應的操作后進一步得到對數據操作后的列表。步驟106對生成的列表中的數據進行更新，得到數據更新后的列表。在本步驟中，當有數據發生變化時，將變化后的數據替換之前已寫入所述DOM中的數據，或者，當有新增的數據需要展示時，將新增的數據繼續寫入所述DOM中，得到數據更新后的列表。在更新過程中，JavMcript應用插件需要確定更新的數據所在的顯示部分，然后將該更新的數據寫入其所在的顯示部分即可。實施例二本申請實施例二以Velocit模板語言為例，結合JavMcript應用插件讀寫數據的方式來說明本申請實施例一方案的具體實現方式。本實施例二的方案包括以下步驟第一步利用Velocit模板語言生成一個宏函數，用于描述HTML形式的D0M。由于Velocit模板語言允許通過簡單的使用模板語言(templatelanguage)來引用由java代碼定義的對象，因此，可以將所述宏函數的表現形式設置為macro(SimpleGrid$id$attrs)，其中，$id表示待生成的列表的唯一標識符，$attrs中的參數表示該列表的結構特征，如列表的設置寬度、每頁顯示條數、列模型等。以宏函數中表示的列表頭為例，該列表頭的HTML結構如下<divclass=“xui-simpIeGrid-header">H定義此段程序表示的塊狀結構是列表頭〈tablestyle=“WIDTH:$width；“>H定義列表頭的表格寬度<tbody><trclass=“xui-simpleGrid-hd-row“>//定義列表頭的行#if($checkbox)H定義列表頭中是否設置選擇框(所述選擇框用于表示該選擇框指代的內容是否被選中)<tdclass=“xui-simpleGrid-hd-checkboxxui-simpIeGrid-cell“style="WIDTH:17px；“><divclass="xui-simpleGrid-hd-innerxui-simpleGrid-hd-inner-default"unselectable="on"Xinputclass="xui_simpleGrid_hd_checkbox〃name=""type="checkbox"value=““/></div>//定義選擇框的格式</td>#end#foreach($colin$colModel)<tdclass="xui_simpleGrid_hd_$col.get(0)xui-simpIeGrid-cell“style=“WIDTH:$col.get(l)；“><divclass="xui-simpleGrid-hd-innerxui-simpleGrid-hd-inner-default"unselectable="on">$col.get(2)<buttonclass="xui-simpleGrid-sort"X/buttonX/div>//定義列表頭的各列</td>#end</tr></tbody></table></div>以上是通過具體的實例說明針對列表頭的定義，也可以按照類似方式定義列表的其他部分。在定義完成列表的DOM后，可以根據宏函數中的$attrs的配置屬性填充希望展示的內容和樣式，例如，可以根據實際內容得到以下形式的宏函數SSimpleGricK"sample(列表的唯一標識符)〃，[[”width"，“600px“](表示列表的寬度占用600象素)，[“limit"，“10"](表示列表每頁顯示10行)，[“hasPagebar"，false](表示是否需要翻頁)，[“checkbox"，true](表示是否需要選擇框)，[“CoIModel"，[[“sex"，“ΙδΟρχ"，“性別〃]，[“age"，“75px"，“年齡〃]，[“birthday"，“75px"，“生日〃]，[”name"，“75px"，“姓名〃]]]](表示每列中顯示的內容是性別占用150象素、年齡占用75象素、生日占用75象素、姓名占用75象素))。第二步創建ess文件，用于為列表架構各部分的數據分別設置展示樣式。由于在第一步中高度抽象了D0M，而DOM中每一個標簽都有一個獨立的class文件來控制，因此，在本步驟中創建一個CSS文件，在該CSS文件中設置各class文件，然后分別為各class文件設置展示樣式。第三步根據需要的操作設置API。第四步Javakript應用插件獲取后臺存儲的數據。在本步驟中，JavaScript應用插件采用init初始化方法獲取數據，來描述顯示列的模型和數據的列模型。第五步后臺以JSON的格式返回數據，JavaScript應用插件將該數據寫入D0M。例如，在本步驟中最終顯示的列表可以為{totalCount:35,data:[{sex:“男〃，age:“10“，birthday:“2008-10-11“，name:“王五〃，status:“1〃},{sex:‘’男〃，age:‘’30‘’，birthday:‘’2008-10-11‘’，name:‘’小明‘’，status〃2〃}，{sex:,〃女“，age:”50“‘,birthday:‘‘2008--10-11“，status//ι//}，{sex:,〃女“，age:”44“‘,birthday:‘‘2008--10-11“，status”0"}，{sex:,〃女“，age:”33“‘,birthday:‘‘2008--10-11“，status//ι//}]ι實施例三本申請實施例三ι還提供-一種與實施例一和實施例二二屬于同一,name:〃,name:〃name:〃張三〃李四“李紅“-發明構思下的列表生成的設備，如圖2所示，所述設備包括DOM生成模塊11、Jav必cript應用插件12和列表生成模塊13，其中D0M生成模塊11用于利用預先設定的后臺語言生成宏函數，所述宏函數用于表示HTML形式的DOMJavaScript應用插件12用于讀取待展示的數據，并將讀取的數據寫入所述DOM；列表生成模塊13用于生成寫入數據后的列表。所述設備還包括樣式設置模塊14，用于在所述DOM中包含生成列表架構的標簽時，為待寫入所述列表架構各部分的數據分別設置展示樣式JavMcript應用插件12具體用于讀取待展示的數據，并按照所述DOM中列表結構各部分設置的展示樣式，將讀取的數據根據列表架構的標簽寫入所述DOM中列表結構的各部分。所述設備還包括API設置模塊15，用于為對待寫入DOM中的數據進行的操作設置至少一個APIJavaScript應用插件12還用于調用所述至少一個API，對生成的列表中的數據進行操作進一步得到對數據操作后的列表。另外，JavaScript應用插件12還用于對生成的列表中的數據進行更新，具體地，當有數據發生變化時，將變化后的數據替換之前已寫入所述DOM中的數據，或者，當有新增的數據需要展示時，將新增的數據繼續寫入所述DOM中，得到數據更新后的列表。本實施例三中的樣式設置模塊14和API設置模塊15可以是獨立于Javakript應用插件12的邏輯部件，也可以是JavMcript應用插件12中的一部分。通過本申請實施例提供的方法及設備，結合利用后臺語言生成表示HTML形式的DOM宏函數和通過JavMcript應用插件讀寫數據的方式生成列表，既克服了常規方式下由JavaScript應用插件創建DOM時需要執行創建DOM操作而導致占用的資源量較大的問題，又避免了需要展示的數據與列表架構完全耦合的情況發生，在每次展示列表時不需要刷新頁面，使列表的展示效果較好；較優地，通過為列表架構各部分分別設置展示樣式以及設置API，可以更好地根據用戶需求設置展示樣式，且實現方式簡單，并且在有數據更新的情況發生時，也能夠在不占用額外系統資源的情況下快速實現列表更新。本領域內的技術人員應明白，本申請的實施例可提供為方法、系統、或計算機程序產品。因此，本申請可采用完全硬件實施例、完全軟件實施例、或結合軟件和硬件方面的實施例的形式。而且，本申請可采用在一個或多個其中包含有計算機可用程序代碼的計算機可用存儲介質(包括但不限于磁盤存儲器、CD-ROM、光學存儲器等)上實施的計算機程序產品的形式。本申請是參照根據本申請實施例的方法、設備(系統)、和計算機程序產品的流程圖和/或方框圖來描述的。應理解可由計算機程序指令實現流程圖和/或方框圖中的每一流程和/或方框、以及流程圖和/或方框圖中的流程和/或方框的結合。可提供這些計算機程序指令到通用計算機、專用計算機、嵌入式處理機或其他可編程數據處理設備的處理器以產生一個機器，使得通過計算機或其他可編程數據處理設備的處理器執行的指令產生用于實現在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能的裝置。這些計算機程序指令也可存儲在能引導計算機或其他可編程數據處理設備以特定方式工作的計算機可讀存儲器中，使得存儲在該計算機可讀存儲器中的指令產生包括指令裝置的制造品，該指令裝置實現在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能。這些計算機程序指令也可裝載到計算機或其他可編程數據處理設備上，使得在計算機或其他可編程設備上執行一系列操作步驟以產生計算機實現的處理，從而在計算機或其他可編程設備上執行的指令提供用于實現在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能的步驟。盡管已描述了本申請的優選實施例，但本領域內的技術人員一旦得知了基本創造性概念，則可對這些實施例做出另外的變更和修改。所以，所附權利要求意欲解釋為包括優選實施例以及落入本申請范圍的所有變更和修改。顯然，本領域的技術人員可以對本申請進行各種改動和變型而不脫離本申請的精神和范圍。這樣，倘若本申請的這些修改和變型屬于本申請權利要求及其等同技術的范圍之內，則本申請也意圖包含這些改動和變型在內。權利要求1.一種列表生成的方法，其特征在于，所述方法包括利用預先設定的后臺語言生成宏函數，所述宏函數用于表示超文本標記語言HTML形式的文檔對象模型DOM；通過客戶端腳本語言JavMcript應用插件讀取待展示的數據，并將讀取的數據寫入所述D0M，生成寫入數據后的列表。2.如權利要求1所述的方法，其特征在于，所述DOM中包含生成列表架構的標簽；生成所述DOM之后，且將讀取的數據寫入所述DOM之前，所述方法還包括為待寫入所述DOM中列表架構各部分的數據分別設置展示樣式；將讀取的數據寫入所述D0M，具體包括按照所述DOM中列表結構各部分設置的展示樣式，將讀取的數據根據列表架構的標簽寫入所述DOM中列表結構的各部分。3.如權利要求1或2所述的方法，其特征在于，生成所述DOM之后，且將讀取的數據寫入所述DOM之前，所述方法還包括為對待寫入DOM中的數據進行的操作設置至少一個應用編程接口API；生成寫入數據后的列表之后，所述方法還包括調用所述至少一個API，對生成的列表中的數據進行操作進一步得到對數據操作后的列表。4.如權利要求1或2所述的方法，其特征在于，生成寫入數據后的列表之后，所述方法還包括對生成的列表中的數據進行更新。5.一種列表生成的設備，其特征在于，所述設備包括DOM生成模塊，用于利用預先設定的后臺語言生成宏函數，所述宏函數用于表示HTML形式的DOM；JavaScript應用插件，用于讀取待展示的數據，并將讀取的數據寫入所述DOM；列表生成模塊，用于生成寫入數據后的列表。6.如權利要求5所述的設備，其特征在于，所述設備還包括樣式設置模塊，用于在所述DOM中包含生成列表架構的標簽時，為待寫入所述列表架構各部分的數據分別設置展示樣式；JavaScript應用插件，具體用于讀取待展示的數據，并按照所述DOM中列表結構各部分設置的展示樣式，將讀取的數據根據列表架構的標簽寫入所述DOM中列表結構的各部分。7.如權利要求5或6所述的設備，其特征在于，所述設備還包括API設置模塊，用于為對待寫入DOM中的數據進行的操作設置至少一個API；JavaScript應用插件，還用于調用所述至少一個API，對生成的列表中的數據進行操作進一步得到對數據操作后的列表。8.如權利要求5或6所述的設備，其特征在于，Jav必cript應用插件，還用于對生成的列表中的數據進行更新。全文摘要本申請公開了一種列表生成的方法及設備，通過結合利用后臺語言生成表示HTML形式的DOM的宏函數和通過JavaScript應用插件讀寫數據的方式生成列表的方式，既克服了常規方式下由JavaScript應用插件生成列表時需要執行創建DOM操作而導致系統性能下降的問題，又避免了需要展示的數據與列表架構完全耦合的情況發生，在每次展示列表時不需要刷新頁面，使列表的展示效果較好。文檔編號G06F17/30GK102339291SQ20101023673公開日2012年2月1日申請日期2010年7月23日優先權日2010年7月23日發明者盛鼎申請人:阿里巴巴集團控股有限公司