專利名稱：一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置和方法
技術(shù)領(lǐng)域：
本發(fā)明涉及計(jì)算機(jī)技術(shù)領(lǐng)域，特別涉及一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置和方法。
背景技術(shù)：
Portal是一種互聯(lián)網(wǎng)頁(yè)面編程語(yǔ)言，通常用來(lái)提供個(gè)性化、單次登錄、聚集各個(gè)信息源的內(nèi)容，并作為信息系統(tǒng)表現(xiàn)層的宿主。文檔對(duì)象模型(Docuement Object Model, DOM)是W3C組織推薦的處理XML的標(biāo)準(zhǔn)適配器。傳統(tǒng)的Portal布局是利用HTML網(wǎng)頁(yè)中不同層(DIV)之間的位置互斥實(shí)現(xiàn)的，當(dāng)Portal的應(yīng)用程序框體移動(dòng)的時(shí)候，就會(huì)產(chǎn)生相對(duì) DOM文檔流的節(jié)點(diǎn)移動(dòng)。頁(yè)面“相對(duì)DOM文檔流的節(jié)點(diǎn)移動(dòng)”就是指一個(gè)DOM節(jié)點(diǎn)(如XML 元素、HTML標(biāo)簽)相對(duì)于它在文檔中的原本位置移至其他DOM節(jié)點(diǎn)的前后或者里面，并不是指這個(gè)DOM節(jié)點(diǎn)在圖形界面上的坐標(biāo)移動(dòng)。現(xiàn)有的DOM采用以下結(jié)構(gòu)<div><div class =〃 coll" ><div id =" contentl" >. . . </div><div id =" content2〃 >. . . </div></div><div class =〃 col2〃 ><div id =" contents" >. . . </div><div id =" content4〃 >. . . </div></div></div>其中，每一個(gè)ID對(duì)應(yīng)的是一個(gè)框體，以及該框體在Portal頁(yè)面的第χ行第y列的位置。因此一旦該框體被拖動(dòng)、刪除，或是增加了一個(gè)框體，框體在DOM中的相對(duì)位置就會(huì)改變。用戶拖拽框體時(shí)，實(shí)質(zhì)上是在改變?cè)揇OM文檔的結(jié)構(gòu)。例如若contentl的文檔結(jié)構(gòu)位置被移動(dòng)至content2后或者col2內(nèi)，那contentl即產(chǎn)生了相對(duì)文檔流的節(jié)點(diǎn)移動(dòng)。 而該種DOM文檔結(jié)構(gòu)，就是傳統(tǒng)的Portal頁(yè)面的DOM文檔結(jié)構(gòu)，它使用一些樣式(如浮動(dòng)、 邊距等)使得該文檔結(jié)構(gòu)展示成Portal式的框體頁(yè)面。Flash是一種交互式矢量多媒體技術(shù)，F(xiàn)lash已經(jīng)漸漸成為交互式知量的標(biāo)準(zhǔn)，未來(lái)網(wǎng)頁(yè)的一大主流。Flash控件可以將Flash內(nèi)部的一些函數(shù)(使用ActionScript編寫) 向網(wǎng)頁(yè)上的JavaScript暴露成一個(gè)該Flash控件所在的DOM節(jié)點(diǎn)的對(duì)象的一個(gè)函數(shù)，借此達(dá)到JavaScript可控制Flash控件的目的。當(dāng)頁(yè)面中包含有Flash插件時(shí)，一旦在頁(yè)面中拖動(dòng)框體移動(dòng)時(shí)，被移動(dòng)的了 DOM節(jié)點(diǎn)的Flash控件會(huì)重新載入內(nèi)容，F(xiàn)lash控件內(nèi)用戶填寫、創(chuàng)建的內(nèi)容將會(huì)丟失。而主流瀏覽器的Flash插件并未考慮這樣的問(wèn)題例如MozillaFirefox系列00147瀏覽器，F(xiàn)lash控件內(nèi)用戶填寫、創(chuàng)建的內(nèi)容將會(huì)丟失。而在Microsoft Internet Explorer系列瀏覽器， 則會(huì)丟失該Flash控件的Flash回調(diào)函數(shù)，網(wǎng)頁(yè)將無(wú)法跟Flash控件進(jìn)行交互。為了避免這種問(wèn)題，現(xiàn)有的一些支持Portal的內(nèi)容管理系統(tǒng)采用了前后臺(tái)分治的模式來(lái)讓用戶自主布局。在默認(rèn)的前臺(tái)模式，所有頁(yè)面內(nèi)容都載入，但應(yīng)用程序的框體不可以拖拽；在后臺(tái)模式，框體能夠拖拽，但頁(yè)面上的框體內(nèi)容將不被載入，只留下占位用的示意框體。這種分治的模式就避免了有Flash內(nèi)容的框體的移動(dòng)。在實(shí)現(xiàn)本發(fā)明的過(guò)程中，發(fā)明人發(fā)現(xiàn)現(xiàn)有技術(shù)至少存在以下問(wèn)題現(xiàn)有技術(shù)中的這種前后臺(tái)分治的模式，當(dāng)用戶要移動(dòng)框體時(shí)，要切換頁(yè)面到不同的模式，操作過(guò)后還要保存，冗余的步驟太多。同時(shí)，開(kāi)發(fā)人員必須寫兩套甚至多套頁(yè)面來(lái)進(jìn)行管理。

發(fā)明內(nèi)容
為了解決現(xiàn)有技術(shù)中存在的在應(yīng)用Portal布局的頁(yè)面中使用Flash時(shí)，采用前后臺(tái)分治帶來(lái)的系統(tǒng)復(fù)雜和編程效率低的問(wèn)題，本發(fā)明實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置和方法。所述技術(shù)方案如下本發(fā)明實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，包括文檔對(duì)象模型模塊，用于存儲(chǔ)所述頁(yè)面中每一框體的內(nèi)容以及每一框體對(duì)應(yīng)的絕對(duì)位置。作為上述技術(shù)方案的優(yōu)選，所述裝置還包括絕對(duì)位置計(jì)算模塊，用于獲取每一框體的寬度和高度，并根據(jù)頁(yè)面中的每一框體的寬度和高度計(jì)算每一框體在頁(yè)面中的絕對(duì)像素位置。作為上述技術(shù)方案的優(yōu)選，所述裝置還包括位置更改計(jì)算模塊，用于根據(jù)框體的位置更改，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。作為上述技術(shù)方案的優(yōu)選，所述絕對(duì)位置計(jì)算模塊包括框體寬度獲取單元，用于根據(jù)預(yù)設(shè)的每一列的寬度比及頁(yè)面的寬度，計(jì)算每一框體的寬度；框體高度獲取單元，用于通過(guò)掃描方式獲取每個(gè)框體的高度；絕對(duì)像素坐標(biāo)計(jì)算單元，用于根據(jù)每個(gè)框體的寬度和高度，計(jì)算每個(gè)框體位于網(wǎng)頁(yè)中的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)。作為上述技術(shù)方案的優(yōu)選，所述絕對(duì)位置計(jì)算模塊還包括行列關(guān)系映射單元，用于存儲(chǔ)網(wǎng)頁(yè)中每一框體的行、列、高度，以及每一框體的框體內(nèi)容ID。作為上述技術(shù)方案的優(yōu)選，所述裝置還包括位置更改計(jì)算模塊，用于根據(jù)框體的位置更改，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。本發(fā)明實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，包括將頁(yè)面中每一框體與文檔對(duì)象模型對(duì)應(yīng)條目之間通過(guò)該框體在頁(yè)面中的絕對(duì)位置建立對(duì)應(yīng)關(guān)系。
作為上述技術(shù)方案的優(yōu)選，所述方法還包括獲取所述每一框體的寬度和高度，并根據(jù)每一框體的寬度和高度計(jì)算所述頁(yè)面中的所述每一框體的絕對(duì)像素位置。作為上述技術(shù)方案的優(yōu)選，所述獲取所述每一框體的寬度和高度，并根據(jù)每一框體的寬度和高度計(jì)算所述頁(yè)面中的所述每一框體的絕對(duì)像素位置包括根據(jù)預(yù)設(shè)的每一列的寬度比及頁(yè)面的寬度，計(jì)算每一框體的寬度；通過(guò)掃描方式獲取每個(gè)框體的高度；根據(jù)每個(gè)框體的寬度和高度，計(jì)算每個(gè)框體位于網(wǎng)頁(yè)中的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)。作為上述技術(shù)方案的優(yōu)選，所述獲取所述每一框體的寬度和高度，并根據(jù)每一框體的寬度和高度計(jì)算所述頁(yè)面中的所述每一框體的絕對(duì)像素位置還包括設(shè)置行列關(guān)系映射矩陣，并將網(wǎng)頁(yè)中每一框體的行、列、高度，以及每一框體的框體內(nèi)容ID存儲(chǔ)到所述行列關(guān)系映射矩陣中。作為上述技術(shù)方案的優(yōu)選，所述方法還包括在框體的位置更改時(shí)，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。本發(fā)明實(shí)施例提供的技術(shù)方案帶來(lái)的有益效果是本發(fā)明實(shí)施例在文檔對(duì)象模型模塊存儲(chǔ)每一框體的內(nèi)容，并存儲(chǔ)每一框體對(duì)應(yīng)的在頁(yè)面中的絕對(duì)位置，以將內(nèi)容與 Portal布局的頁(yè)面中每一框體實(shí)現(xiàn)一一對(duì)應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進(jìn)行對(duì)應(yīng)的方式，可以實(shí)現(xiàn)框體在移動(dòng)時(shí)只需更改DOM中每一框體存儲(chǔ)的絕對(duì)位置參數(shù)即可。本發(fā)明實(shí)施例可以實(shí)現(xiàn)在Portal布局的網(wǎng)頁(yè)中拖動(dòng)框體時(shí)， 不產(chǎn)生相對(duì)DOM文檔流的節(jié)點(diǎn)移動(dòng)，這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁(yè)中應(yīng)用 Flash后，拖動(dòng)框體會(huì)造成Flash失效的問(wèn)題，且能夠使Portal布局的網(wǎng)頁(yè)結(jié)構(gòu)更為簡(jiǎn)單， 提高系統(tǒng)的靈活性。


圖1為本發(fā)明第一實(shí)施例的業(yè)務(wù)對(duì)象類型與科目的對(duì)應(yīng)裝置的結(jié)構(gòu)示意圖；圖2為本發(fā)明第二實(shí)施例的業(yè)務(wù)對(duì)象類型與科目的對(duì)應(yīng)裝置的結(jié)構(gòu)示意圖；圖3為本發(fā)明的業(yè)務(wù)對(duì)象類型與科目的對(duì)應(yīng)裝置的一個(gè)具體實(shí)例；圖4為本發(fā)明第三實(shí)施例的業(yè)務(wù)對(duì)象類型與科目的對(duì)應(yīng)方法的流程具體實(shí)施例方式為使本發(fā)明的目的、技術(shù)方案和優(yōu)點(diǎn)更加清楚，下面將結(jié)合附圖對(duì)本發(fā)明實(shí)施方式作進(jìn)一步地詳細(xì)描述。實(shí)施例1本發(fā)明實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，包括文檔對(duì)象模型模塊1，用于存儲(chǔ)所述頁(yè)面中每一框體的內(nèi)容以及每一框體對(duì)應(yīng)的絕對(duì)位置。
6
本發(fā)明實(shí)施例在文檔對(duì)象模型模塊存儲(chǔ)每一框體的內(nèi)容，并存儲(chǔ)每一框體對(duì)應(yīng)的在頁(yè)面中的絕對(duì)位置，以將內(nèi)容與Portal布局的頁(yè)面中每一框體實(shí)現(xiàn)一一對(duì)應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進(jìn)行對(duì)應(yīng)的方式，可以實(shí)現(xiàn)框體在移動(dòng)時(shí)只需更改DOM中每一框體存儲(chǔ)的絕對(duì)位置參數(shù)即可。本發(fā)明實(shí)施例可以實(shí)現(xiàn)在 Portal布局的網(wǎng)頁(yè)中拖動(dòng)框體時(shí)，不產(chǎn)生相對(duì)DOM文檔流的節(jié)點(diǎn)移動(dòng)，這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁(yè)中應(yīng)用Flash后，拖動(dòng)框體會(huì)造成Flash失效的問(wèn)題，且能夠使Portal布局的網(wǎng)頁(yè)結(jié)構(gòu)更為簡(jiǎn)單，提高系統(tǒng)的靈活性。實(shí)施例2本發(fā)明第二實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，其結(jié)構(gòu)如圖1所示，包括文檔對(duì)象模型模塊1，用于存儲(chǔ)所述頁(yè)面中每一框體的內(nèi)容以及每一框體對(duì)應(yīng)的絕對(duì)位置；絕對(duì)位置計(jì)算模塊2，用于獲取每一框體的寬度和高度，并根據(jù)頁(yè)面中的每一框體的寬度和高度計(jì)算每一框體在頁(yè)面中的絕對(duì)像素位置；位置更改計(jì)算模塊3，用于根據(jù)框體的位置更改，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。本發(fā)明第二實(shí)施例中增加了絕對(duì)位置計(jì)算模塊2和/或位置更改計(jì)算模塊3，上述兩個(gè)模塊為可選的，可以擇一或同時(shí)使用。絕對(duì)位置計(jì)算模塊2可以根據(jù)每一框體的高度和寬度計(jì)算出絕對(duì)像素位置。這樣，可以以每一網(wǎng)頁(yè)的左上角作為原點(diǎn)，依次根據(jù)每一框體的高度和寬度，計(jì)算出每一框體的絕對(duì)像素位置橫坐標(biāo)和縱坐標(biāo)。這種方式簡(jiǎn)單易行，不會(huì)對(duì)造成無(wú)謂的系統(tǒng)開(kāi)銷。當(dāng)然， 還可以選擇其他位置作為坐標(biāo)原點(diǎn)，或是采用其他方式計(jì)算絕對(duì)像素位置，本發(fā)明實(shí)施例僅為舉例說(shuō)明，并不以此為限。同時(shí)，還可以使用其他方式計(jì)算框體的絕對(duì)位置，而不限定于通過(guò)絕對(duì)像素位置的方式確定框體的絕對(duì)位置。同時(shí)，框體的絕對(duì)位置也可以采用其他方式，本實(shí)施例采用絕對(duì)像素位置，只是一種舉例說(shuō)明。其中，如圖3所示，絕對(duì)位置計(jì)算模塊2可以具體為框體寬度獲取單元21，用于根據(jù)預(yù)設(shè)的每一列的寬度比及頁(yè)面的寬度，計(jì)算每一框體的寬度；框體高度獲取單元22，用于通過(guò)掃描方式獲取每個(gè)框體的高度；絕對(duì)像素坐標(biāo)計(jì)算單元23，用于根據(jù)每個(gè)框體的寬度和高度，計(jì)算每個(gè)框體位于網(wǎng)頁(yè)中的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)；行列關(guān)系映射單元24，用于記錄每一框體的行、列、高度，以及對(duì)應(yīng)的框體內(nèi)容 ID。由于現(xiàn)有的Portal頁(yè)面的列寬比、框體的列數(shù)、列間距是預(yù)設(shè)的，因此根據(jù)這些預(yù)設(shè)值可以計(jì)算處每一列的寬度，而該列內(nèi)每一框體的寬度都是與列寬度相等的。例如列寬比例是一個(gè)百分比數(shù)組，例如
就代表了第一列寬度占頁(yè)面寬度的20%、第二列占60%、第三列占20% ；這個(gè)數(shù)組的值的總和小于等于100% ；第 η列m行框體的寬度=(頁(yè)面總寬度_(列數(shù)+1) X間距)X第η列的列寬比例。這樣，可以簡(jiǎn)單的通過(guò)已知參數(shù)計(jì)算出每一框體的寬度。獲得每一框體的寬度后，可以簡(jiǎn)單的獲得框體的橫坐標(biāo)。對(duì)于高度，可以通過(guò)掃描的方式獲取。掃描頁(yè)面為一種現(xiàn)有技術(shù)，在此不再贅述。 獲得了框體的寬度后，就可以簡(jiǎn)單的獲得框體的縱坐標(biāo)。當(dāng)然，寬度也可以通過(guò)掃描的方式獲得。且寬度、高度還可以通過(guò)其他方式獲得， 本發(fā)明實(shí)施例只是舉例說(shuō)明，并不以此為限。其中，行列關(guān)系映射單元24可以為一行列關(guān)系映射矩陣，該矩陣的形式可以為matrix =[[框體1，框體2]，[框體5，框體6]，[框體3，框體4]]；上例中的矩陣只是為了舉例說(shuō)明，其對(duì)應(yīng)的網(wǎng)頁(yè)有3列2行，第列中是框體1、框體 2，第二列中是框體5、框體6，第三列中是框體3、框體4。這樣，就可以對(duì)應(yīng)的獲知每一框體的行、列；然后再掃描得出的框體高度，并確定每一框體的框體內(nèi)容ID。這樣就可以將該矩陣與DOM進(jìn)行對(duì)應(yīng)，并使DOM獲知每一框體的橫坐標(biāo)、縱坐標(biāo)。通過(guò)矩陣這種形式可以直觀的將網(wǎng)頁(yè)中的框體表現(xiàn)出來(lái)，同時(shí)又能將每一框體對(duì)應(yīng)的參數(shù)進(jìn)行存儲(chǔ)，以方便與DOM中的框體參數(shù)進(jìn)行一一對(duì)應(yīng)。當(dāng)然，采用矩陣的方式只是本發(fā)明實(shí)施例的一個(gè)舉例說(shuō)明，還可以采用其他方式， 例如列表的方式，本發(fā)明實(shí)施例并不以此為限。位置更改計(jì)算模塊3可以根據(jù)每一次的框體位置更改，重新計(jì)算每一框體的新的絕對(duì)像素位置。這種更改可以為增加一個(gè)框體、刪除一個(gè)框體、拖動(dòng)一個(gè)框體以改變框體的行和/或列。例如當(dāng)用戶拖動(dòng)框體時(shí)，可以通過(guò)以下方法修改每一個(gè)框體的絕對(duì)像素位置的變化101、用戶開(kāi)始拖拽一個(gè)框體時(shí)，先判斷該框體是否能拖拽，若不能則將該框體回到原來(lái)位置，步驟結(jié)束；如果能則進(jìn)入步驟102 ；102、用戶松開(kāi)鼠標(biāo)結(jié)束拖拽時(shí)，先判斷該放手位置是否在頁(yè)面內(nèi)，若不在則將該框體回到原來(lái)位置，步驟結(jié)束；如果能則進(jìn)入步驟103 ；103、遍歷行列關(guān)系映射矩陣，找到用戶松開(kāi)鼠標(biāo)時(shí)的位置的坐標(biāo)對(duì)應(yīng)行列位置， 也就是框體被移動(dòng)到的新位置，如第η列第m行；104、將矩陣內(nèi)第η列第m行后的所有框體(包括第m行)往后移動(dòng)一個(gè)位置，這些框體記錄著的行信息相應(yīng)加1 ；105、被拖拽的框體將從矩陣原來(lái)的位置移動(dòng)至第η列第m行。當(dāng)用戶增加一個(gè)框體時(shí)，可以通過(guò)以下方法修改每一個(gè)框體的絕對(duì)像素位置的變化新增一個(gè)框體時(shí)，該框體將會(huì)被安排于第一列第一行，第一列原有的框體的行位置將全部加1。當(dāng)用戶刪除一個(gè)框體時(shí)，可以通過(guò)以下方法修改每一個(gè)框體的絕對(duì)像素位置的變化
刪除一個(gè)框體時(shí)，該列該框體后的所有框體的行位置將全部減1。在上述的增加、刪除、修改行為發(fā)生后，Portal布局算法會(huì)對(duì)網(wǎng)頁(yè)進(jìn)行重新布局。 同時(shí)，相應(yīng)的也會(huì)修改DOM中的每一框體的絕對(duì)像素位置，在不產(chǎn)生相對(duì)DOM文檔流的節(jié)點(diǎn)移動(dòng)的前提下任何更改Portal布局算法中的框體位置。進(jìn)一步的，在框體發(fā)生變化時(shí)，修改行列關(guān)系映射單元24的行列關(guān)系映射矩陣， 并通過(guò)該矩陣實(shí)現(xiàn)對(duì)DOM的映射關(guān)系。實(shí)施例3本發(fā)明第三實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，包括將頁(yè)面中每一框體與文檔對(duì)象模型的相應(yīng)條目之間，通過(guò)該框體在頁(yè)面中的絕對(duì)位置建立對(duì)應(yīng)關(guān)系。本發(fā)明實(shí)施例在文檔對(duì)象模型中，通過(guò)每一框體對(duì)應(yīng)的在頁(yè)面中的絕對(duì)位置，將頁(yè)面中的框體與DOM中的相應(yīng)的每一框體的內(nèi)容之間建立起對(duì)應(yīng)關(guān)系，以將內(nèi)容與Portal 布局的頁(yè)面中每一框體實(shí)現(xiàn)一一對(duì)應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進(jìn)行對(duì)應(yīng)的方式，可以實(shí)現(xiàn)框體在移動(dòng)時(shí)只需更改DOM中每一框體存儲(chǔ)的絕對(duì)位置參數(shù)即可。本發(fā)明實(shí)施例可以實(shí)現(xiàn)在Portal布局的網(wǎng)頁(yè)中拖動(dòng)框體時(shí)，不產(chǎn)生相對(duì) DOM文檔流的節(jié)點(diǎn)移動(dòng)，這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁(yè)中應(yīng)用Flash后，拖動(dòng)框體會(huì)造成Flash失效的問(wèn)題，且能夠使Portal布局的網(wǎng)頁(yè)結(jié)構(gòu)更為簡(jiǎn)單，提高系統(tǒng)的靈活性。實(shí)施例4本發(fā)明第四實(shí)施例提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，是在第三實(shí)施例的基礎(chǔ)上改進(jìn)而來(lái)，其流程如圖3所示，包括步驟201、獲取每一框體的寬度和高度，并根據(jù)頁(yè)面中的每一框體的寬度和高度計(jì)算每一框體在頁(yè)面中的絕對(duì)像素位置；步驟202、將頁(yè)面中每一框體與文檔對(duì)象模型的相應(yīng)條目之間，通過(guò)該框體在頁(yè)面中的絕對(duì)位置建立對(duì)應(yīng)關(guān)系；步驟203、當(dāng)所述框體的位置更改，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。與第三實(shí)施例相比，本實(shí)施例提出了一種計(jì)算絕對(duì)位置的方法，即通過(guò)絕對(duì)像素位置作為絕對(duì)位置，確定框體的位置。上述的步驟201和步驟203都是可選的步驟，可以擇一或同時(shí)使用。其中，步驟201公開(kāi)了一種絕對(duì)像素位置計(jì)算方法，可以根據(jù)每一框體的高度和寬度計(jì)算出絕對(duì)像素位置。這樣，可以以每一網(wǎng)頁(yè)的左上角作為原點(diǎn)，依次根據(jù)每一框體的高度和寬度，計(jì)算出每一框體的絕對(duì)像素位置橫坐標(biāo)和縱坐標(biāo)。這種方式簡(jiǎn)單易行，不會(huì)對(duì)造成無(wú)謂的系統(tǒng)開(kāi)銷。當(dāng)然，還可以選擇其他位置作為坐標(biāo)原點(diǎn)，或是采用其他方式計(jì)算絕對(duì)像素位置，本發(fā)明實(shí)施例僅為舉例說(shuō)明，并不以此為限。同時(shí)，還可以使用其他方式計(jì)算框體的絕對(duì)位置，而不限定于通過(guò)絕對(duì)像素位置的方式確定框體的絕對(duì)位置。同時(shí)，框體的絕對(duì)位置也可以采用其他方式，本實(shí)施例采用絕對(duì)像素位置，只是一種舉例說(shuō)明。其中，步驟201可以具體為步驟2011、根據(jù)預(yù)設(shè)的每一列的寬度比及頁(yè)面的寬度，計(jì)算每一框體的寬度；
步驟2012、通過(guò)掃描方式獲取每個(gè)框體的高度；步驟2013、根據(jù)每個(gè)框體的寬度和高度，計(jì)算每個(gè)框體位于網(wǎng)頁(yè)中的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)。進(jìn)一步的，還可以包括步驟2014、將該框體參數(shù)存儲(chǔ)，其中參數(shù)包括該框體的行、列、高度，以及對(duì)應(yīng)的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)，以及對(duì)應(yīng)的框體內(nèi)容ID。由于現(xiàn)有的Portal頁(yè)面的列寬比、框體的列數(shù)、列間距是預(yù)設(shè)的，因此根據(jù)這些預(yù)設(shè)值可以計(jì)算處每一列的寬度，而該列內(nèi)每一框體的寬度都是與列寬度相等的。例如列寬比例是一個(gè)百分比數(shù)組，例如
就代表了第一列寬度占頁(yè)面寬度的20%、第二列占60%、第三列占20% ；這個(gè)數(shù)組的值的總和小于等于100% ；第 η列m行框體的寬度=(頁(yè)面總寬度_(列數(shù)+1) X間距)X第η列的列寬比例。這樣，可以簡(jiǎn)單的通過(guò)已知參數(shù)計(jì)算出每一框體的寬度。獲得每一框體的寬度后，可以簡(jiǎn)單的獲得框體的橫坐標(biāo)。對(duì)于高度，可以通過(guò)掃描的方式獲取。掃描頁(yè)面為一種現(xiàn)有技術(shù)，在此不再贅述。 獲得了框體的寬度后，就可以簡(jiǎn)單的獲得框體的縱坐標(biāo)。當(dāng)然，寬度也可以通過(guò)掃描的方式獲得。且寬度、高度還可以通過(guò)其他方式獲得， 本發(fā)明實(shí)施例只是舉例說(shuō)明，并不以此為限。其中，步驟2014中可以通過(guò)行列關(guān)系映射矩陣存儲(chǔ)上述的參數(shù)，該矩陣的形式可以為matrix =[[框體1，框體2]，[框體5，框體6]，[框體3，框體4]]；上例中的矩陣只是為了舉例說(shuō)明，其對(duì)應(yīng)的網(wǎng)頁(yè)有3列2行，第一列中是框體1、框體2，第二列中是框體5、框體6，第三列中是框體3、框體4。這樣，就可以對(duì)應(yīng)的獲知每一框體的行、列；然后再掃描得出的框體高度，并確定每一框體的框體內(nèi)容ID。這樣就可以將該矩陣與DOM進(jìn)行對(duì)應(yīng)，并使DOM獲知每一框體的橫坐標(biāo)、縱坐標(biāo)。通過(guò)矩陣這種形式可以直觀的將網(wǎng)頁(yè)中的框體表現(xiàn)出來(lái)，同時(shí)又能將每一框體對(duì)應(yīng)的參數(shù)進(jìn)行存儲(chǔ)，以方便與DOM中的框體參數(shù)進(jìn)行一一對(duì)應(yīng)。當(dāng)然，采用矩陣的方式只是本發(fā)明實(shí)施例的一個(gè)舉例說(shuō)明，還可以采用其他方式， 例如列表的方式，本發(fā)明實(shí)施例并不以此為限。其中，步驟203公開(kāi)了一種框體位置更改時(shí)，新的框體絕對(duì)像素位置的計(jì)算方法。 步驟203可以根據(jù)每一次的框體位置更改，重新計(jì)算每一框體的新的絕對(duì)像素位置。這種更改可以為增加一個(gè)框體、刪除一個(gè)框體、拖動(dòng)一個(gè)框體以改變框體的行和/或列。例如當(dāng)用戶拖動(dòng)框體時(shí)，可以通過(guò)以下方法修改每一個(gè)框體的絕對(duì)像素位置的變化101、用戶開(kāi)始拖拽一個(gè)框體時(shí)，先判斷該框體是否能拖拽，若不能則將該框體回到原來(lái)位置，步驟結(jié)束；如果能則進(jìn)入步驟102 ；
102、用戶松開(kāi)鼠標(biāo)結(jié)束拖拽時(shí)，先判斷該放手位置是否在頁(yè)面內(nèi)，若不在則將該框體回到原來(lái)位置，步驟結(jié)束；如果能則進(jìn)入步驟103 ；103、遍歷行列關(guān)系映射矩陣，找到用戶松開(kāi)鼠標(biāo)時(shí)的位置的坐標(biāo)對(duì)應(yīng)行列位置， 也就是框體被移動(dòng)到的新位置，如第η列第m行；104、將矩陣內(nèi)第η列第m行后的所有框體(包括第m行)往后移動(dòng)一個(gè)位置，這些框體記錄著的行信息相應(yīng)加1 ；105、被拖拽的框體將從矩陣原來(lái)的位置移動(dòng)至第η列第m行。當(dāng)用戶增加一個(gè)框體時(shí)，可以通過(guò)以下方法修改每一個(gè)框體的絕對(duì)像素位置的變化新增一個(gè)框體時(shí)，該框體將會(huì)被安排于第一列第一行，第一列原有的框體的行位置將全部加1。當(dāng)用戶刪除一個(gè)框體時(shí)，可以通過(guò)以下方法修改每一個(gè)框體的絕對(duì)像素位置的變化刪除一個(gè)框體時(shí)，該列該框體后的所有框體的行位置將全部減1。在上述的增加、刪除、修改行為發(fā)生后，Portal布局算法會(huì)對(duì)網(wǎng)頁(yè)進(jìn)行重新布局。 同時(shí)，相應(yīng)的也會(huì)修改DOM中的每一框體的絕對(duì)像素位置，在不產(chǎn)生相對(duì)DOM文檔流的節(jié)點(diǎn)移動(dòng)的前提下任何更改Portal布局算法中的框體位置。進(jìn)一步的，在框體發(fā)生變化時(shí)，修改步驟2014中的行列關(guān)系映射矩陣，并通過(guò)該矩陣實(shí)現(xiàn)對(duì)DOM的映射關(guān)系。以上實(shí)施例提供的技術(shù)方案中的全部或部分內(nèi)容可以通過(guò)軟件編程實(shí)現(xiàn)，其軟件程序存儲(chǔ)在可讀取的存儲(chǔ)介質(zhì)中，存儲(chǔ)介質(zhì)例如計(jì)算機(jī)中的硬盤、光盤或軟盤。通過(guò)以上實(shí)施例可以看出，本發(fā)明實(shí)施例提出的Portal布局的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，通過(guò)每一框體對(duì)應(yīng)的在頁(yè)面中的絕對(duì)位置，將頁(yè)面中的框體與DOM中的相應(yīng)的每一框體的內(nèi)容之間建立起對(duì)應(yīng)關(guān)系，以將內(nèi)容與Portal布局的頁(yè)面中每一框體實(shí)現(xiàn)一一對(duì)應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進(jìn)行對(duì)應(yīng)的方式，可以實(shí)現(xiàn)框體在移動(dòng)時(shí)只需更改DOM中每一框體存儲(chǔ)的絕對(duì)位置參數(shù)即可。本發(fā)明實(shí)施例可以實(shí)現(xiàn)在Portal布局的網(wǎng)頁(yè)中拖動(dòng)框體時(shí)，不產(chǎn)生相對(duì)DOM文檔流的節(jié)點(diǎn)移動(dòng)，這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁(yè)中應(yīng)用Flash后，拖動(dòng)框體會(huì)造成Flash 失效的問(wèn)題，且能夠使Portal布局的網(wǎng)頁(yè)結(jié)構(gòu)更為簡(jiǎn)單，提高系統(tǒng)的靈活性。同時(shí)，還提出了絕對(duì)像素位置的計(jì)算方法和模塊，這種方式簡(jiǎn)單易行，不會(huì)對(duì)造成無(wú)謂的系統(tǒng)開(kāi)銷。還提出了當(dāng)框體位置改變時(shí)計(jì)算新的框體絕對(duì)像素位置的方法和裝置，就可以將行列關(guān)系映射矩陣與DOM進(jìn)行對(duì)應(yīng)，并使DOM獲知每一框體的橫坐標(biāo)、縱坐標(biāo)。通過(guò)矩陣這種形式可以直觀的將網(wǎng)頁(yè)中的框體表現(xiàn)出來(lái)，同時(shí)又能將每一框體對(duì)應(yīng)的參數(shù)進(jìn)行存儲(chǔ)，以方便與DOM 中的框體參數(shù)進(jìn)行——對(duì)應(yīng)。進(jìn)一步的，本發(fā)明實(shí)施例提出了通過(guò)行列關(guān)系映射矩陣建立于DOM的對(duì)應(yīng)關(guān)系，這樣可以直觀的將網(wǎng)頁(yè)中的框體表現(xiàn)出來(lái)，同時(shí)又能將每一框體對(duì)應(yīng)的參數(shù)進(jìn)行存儲(chǔ)，以方便與DOM中的框體參數(shù)進(jìn)行一一對(duì)應(yīng)。以上僅為本發(fā)明的較佳實(shí)施例，并不用以限制本發(fā)明，凡在本發(fā)明的精神和原則之內(nèi)，所作的任何修改、等同替換、改進(jìn)等，均應(yīng)包含在本發(fā)明的保護(hù)范圍之內(nèi)。
1權(quán)利要求
1.一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，包括文檔對(duì)象模型模塊，用于存儲(chǔ)所述頁(yè)面中每一框體的內(nèi)容以及每一框體對(duì)應(yīng)的絕對(duì)位置。
2.根據(jù)權(quán)利要求1所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，其特征在于，所述裝置還包括絕對(duì)位置計(jì)算模塊，用于獲取每一框體的寬度和高度，并根據(jù)頁(yè)面中的每一框體的寬度和高度計(jì)算每一框體在頁(yè)面中的絕對(duì)像素位置。
3.根據(jù)權(quán)利要求2所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，其特征在于，所述絕對(duì)位置計(jì)算模塊包括框體寬度獲取單元，用于根據(jù)預(yù)設(shè)的每一列的寬度比及頁(yè)面的寬度，計(jì)算每一框體的寬度；框體高度獲取單元，用于通過(guò)掃描方式獲取每個(gè)框體的高度；絕對(duì)像素坐標(biāo)計(jì)算單元，用于根據(jù)每個(gè)框體的寬度和高度，計(jì)算每個(gè)框體位于網(wǎng)頁(yè)中的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)。
4.根據(jù)權(quán)利要求3所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，其特征在于，所述絕對(duì)位置計(jì)算模塊還包括行列關(guān)系映射單元，用于存儲(chǔ)網(wǎng)頁(yè)中每一框體的行、列、高度，以及每一框體的框體內(nèi)容ID。
5.根據(jù)權(quán)利要求2或3或4所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置，其特征在于，所述裝置還包括位置更改計(jì)算模塊，用于根據(jù)框體的位置更改，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。
6.一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，其特征在于，包括將頁(yè)面中每一框體與文檔對(duì)象模型對(duì)應(yīng)條目之間通過(guò)該框體在頁(yè)面中的絕對(duì)位置建立對(duì)應(yīng)關(guān)系。
7.根據(jù)權(quán)利要求6所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，其特征在于，所述方法還包括獲取所述每一框體的寬度和高度，并根據(jù)每一框體的寬度和高度計(jì)算所述頁(yè)面中的所述每一框體的絕對(duì)像素位置。
8.根據(jù)權(quán)利要求7所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，其特征在于，所述獲取所述每一框體的寬度和高度，并根據(jù)每一框體的寬度和高度計(jì)算所述頁(yè)面中的所述每一框體的絕對(duì)像素位置包括根據(jù)預(yù)設(shè)的每一列的寬度比及頁(yè)面的寬度，計(jì)算每一框體的寬度；通過(guò)掃描方式獲取每個(gè)框體的高度；根據(jù)每個(gè)框體的寬度和高度，計(jì)算每個(gè)框體位于網(wǎng)頁(yè)中的絕對(duì)像素橫坐標(biāo)和縱坐標(biāo)。
9.根據(jù)權(quán)利要求8所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，其特征在于，所述獲取所述每一框體的寬度和高度，并根據(jù)每一框體的寬度和高度計(jì)算所述頁(yè)面中的所述每一框體的絕對(duì)像素位置還包括設(shè)置行列關(guān)系映射矩陣，并將網(wǎng)頁(yè)中每一框體的行、列、高度，以及每一框體的框體內(nèi)容ID存儲(chǔ)到所述行列關(guān)系映射矩陣中。
10.根據(jù)權(quán)利要求7或8或9所述的網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)方法，其特征在于，所述方法還包括在框體的位置更改時(shí)，獲取框體新的絕對(duì)位置，并根據(jù)所述新的絕對(duì)位置更改所述文檔對(duì)象模型模塊中每一框體對(duì)應(yīng)的絕對(duì)像素位置。
全文摘要
本發(fā)明提出了一種網(wǎng)頁(yè)與文檔對(duì)象模型的對(duì)應(yīng)裝置和方法，屬于計(jì)算機(jī)技術(shù)領(lǐng)域。本發(fā)明實(shí)施例在文檔對(duì)象模型模塊存儲(chǔ)每一框體的內(nèi)容，并存儲(chǔ)每一框體對(duì)應(yīng)的在頁(yè)面中的絕對(duì)位置，以將內(nèi)容與Portal布局的頁(yè)面中每一框體實(shí)現(xiàn)一一對(duì)應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進(jìn)行對(duì)應(yīng)的方式，可以實(shí)現(xiàn)框體在移動(dòng)時(shí)只需更改DOM中每一框體存儲(chǔ)的絕對(duì)位置參數(shù)即可。本發(fā)明實(shí)施例可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁(yè)中應(yīng)用Flash后，拖動(dòng)框體會(huì)造成Flash失效的問(wèn)題，且能夠使Portal布局的網(wǎng)頁(yè)結(jié)構(gòu)更為簡(jiǎn)單，提高系統(tǒng)的靈活性。
文檔編號(hào)G06F17/30GK102200985SQ20101013975
公開(kāi)日2011年9月28日 申請(qǐng)日期2010年3月23日 優(yōu)先權(quán)日2010年3月23日
發(fā)明者謝偉幸 申請(qǐng)人:深圳市金蝶中間件有限公司