專利名稱:一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置和方法
技術(shù)領(lǐng)域:
本發(fā)明涉及計算機技術(shù)領(lǐng)域,特別涉及一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置和方法。
背景技術(shù):
Portal是一種互聯(lián)網(wǎng)頁面編程語言,通常用來提供個性化、單次登錄、聚集各個信息源的內(nèi)容,并作為信息系統(tǒng)表現(xiàn)層的宿主。文檔對象模型(Docuement Object Model, DOM)是W3C組織推薦的處理XML的標(biāo)準適配器。傳統(tǒng)的Portal布局是利用HTML網(wǎng)頁中不同層(DIV)之間的位置互斥實現(xiàn)的,當(dāng)Portal的應(yīng)用程序框體移動的時候,就會產(chǎn)生相對 DOM文檔流的節(jié)點移動。頁面“相對DOM文檔流的節(jié)點移動”就是指一個DOM節(jié)點(如XML 元素、HTML標(biāo)簽)相對于它在文檔中的原本位置移至其他DOM節(jié)點的前后或者里面,并不是指這個DOM節(jié)點在圖形界面上的坐標(biāo)移動。現(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>其中,每一個ID對應(yīng)的是一個框體,以及該框體在Portal頁面的第χ行第y列的位置。因此一旦該框體被拖動、刪除,或是增加了一個框體,框體在DOM中的相對位置就會改變。用戶拖拽框體時,實質(zhì)上是在改變該DOM文檔的結(jié)構(gòu)。例如若contentl的文檔結(jié)構(gòu)位置被移動至content2后或者col2內(nèi),那contentl即產(chǎn)生了相對文檔流的節(jié)點移動。 而該種DOM文檔結(jié)構(gòu),就是傳統(tǒng)的Portal頁面的DOM文檔結(jié)構(gòu),它使用一些樣式(如浮動、 邊距等)使得該文檔結(jié)構(gòu)展示成Portal式的框體頁面。Flash是一種交互式矢量多媒體技術(shù),F(xiàn)lash已經(jīng)漸漸成為交互式知量的標(biāo)準,未來網(wǎng)頁的一大主流。Flash控件可以將Flash內(nèi)部的一些函數(shù)(使用ActionScript編寫) 向網(wǎng)頁上的JavaScript暴露成一個該Flash控件所在的DOM節(jié)點的對象的一個函數(shù),借此達到JavaScript可控制Flash控件的目的。當(dāng)頁面中包含有Flash插件時,一旦在頁面中拖動框體移動時,被移動的了 DOM節(jié)點的Flash控件會重新載入內(nèi)容,F(xiàn)lash控件內(nèi)用戶填寫、創(chuàng)建的內(nèi)容將會丟失。而主流瀏覽器的Flash插件并未考慮這樣的問題例如MozillaFirefox系列00147瀏覽器,F(xiàn)lash控件內(nèi)用戶填寫、創(chuàng)建的內(nèi)容將會丟失。而在Microsoft Internet Explorer系列瀏覽器, 則會丟失該Flash控件的Flash回調(diào)函數(shù),網(wǎng)頁將無法跟Flash控件進行交互。為了避免這種問題,現(xiàn)有的一些支持Portal的內(nèi)容管理系統(tǒng)采用了前后臺分治的模式來讓用戶自主布局。在默認的前臺模式,所有頁面內(nèi)容都載入,但應(yīng)用程序的框體不可以拖拽;在后臺模式,框體能夠拖拽,但頁面上的框體內(nèi)容將不被載入,只留下占位用的示意框體。這種分治的模式就避免了有Flash內(nèi)容的框體的移動。在實現(xiàn)本發(fā)明的過程中,發(fā)明人發(fā)現(xiàn)現(xiàn)有技術(shù)至少存在以下問題現(xiàn)有技術(shù)中的這種前后臺分治的模式,當(dāng)用戶要移動框體時,要切換頁面到不同的模式,操作過后還要保存,冗余的步驟太多。同時,開發(fā)人員必須寫兩套甚至多套頁面來進行管理。
發(fā)明內(nèi)容
為了解決現(xiàn)有技術(shù)中存在的在應(yīng)用Portal布局的頁面中使用Flash時,采用前后臺分治帶來的系統(tǒng)復(fù)雜和編程效率低的問題,本發(fā)明實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置和方法。所述技術(shù)方案如下本發(fā)明實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置,包括文檔對象模型模塊,用于存儲所述頁面中每一框體的內(nèi)容以及每一框體對應(yīng)的絕對位置。作為上述技術(shù)方案的優(yōu)選,所述裝置還包括絕對位置計算模塊,用于獲取每一框體的寬度和高度,并根據(jù)頁面中的每一框體的寬度和高度計算每一框體在頁面中的絕對像素位置。作為上述技術(shù)方案的優(yōu)選,所述裝置還包括位置更改計算模塊,用于根據(jù)框體的位置更改,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。作為上述技術(shù)方案的優(yōu)選,所述絕對位置計算模塊包括框體寬度獲取單元,用于根據(jù)預(yù)設(shè)的每一列的寬度比及頁面的寬度,計算每一框體的寬度;框體高度獲取單元,用于通過掃描方式獲取每個框體的高度;絕對像素坐標(biāo)計算單元,用于根據(jù)每個框體的寬度和高度,計算每個框體位于網(wǎng)頁中的絕對像素橫坐標(biāo)和縱坐標(biāo)。作為上述技術(shù)方案的優(yōu)選,所述絕對位置計算模塊還包括行列關(guān)系映射單元,用于存儲網(wǎng)頁中每一框體的行、列、高度,以及每一框體的框體內(nèi)容ID。作為上述技術(shù)方案的優(yōu)選,所述裝置還包括位置更改計算模塊,用于根據(jù)框體的位置更改,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。本發(fā)明實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)方法,包括將頁面中每一框體與文檔對象模型對應(yīng)條目之間通過該框體在頁面中的絕對位置建立對應(yīng)關(guān)系。
作為上述技術(shù)方案的優(yōu)選,所述方法還包括獲取所述每一框體的寬度和高度,并根據(jù)每一框體的寬度和高度計算所述頁面中的所述每一框體的絕對像素位置。作為上述技術(shù)方案的優(yōu)選,所述獲取所述每一框體的寬度和高度,并根據(jù)每一框體的寬度和高度計算所述頁面中的所述每一框體的絕對像素位置包括根據(jù)預(yù)設(shè)的每一列的寬度比及頁面的寬度,計算每一框體的寬度;通過掃描方式獲取每個框體的高度;根據(jù)每個框體的寬度和高度,計算每個框體位于網(wǎng)頁中的絕對像素橫坐標(biāo)和縱坐標(biāo)。作為上述技術(shù)方案的優(yōu)選,所述獲取所述每一框體的寬度和高度,并根據(jù)每一框體的寬度和高度計算所述頁面中的所述每一框體的絕對像素位置還包括設(shè)置行列關(guān)系映射矩陣,并將網(wǎng)頁中每一框體的行、列、高度,以及每一框體的框體內(nèi)容ID存儲到所述行列關(guān)系映射矩陣中。作為上述技術(shù)方案的優(yōu)選,所述方法還包括在框體的位置更改時,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。本發(fā)明實施例提供的技術(shù)方案帶來的有益效果是本發(fā)明實施例在文檔對象模型模塊存儲每一框體的內(nèi)容,并存儲每一框體對應(yīng)的在頁面中的絕對位置,以將內(nèi)容與 Portal布局的頁面中每一框體實現(xiàn)一一對應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進行對應(yīng)的方式,可以實現(xiàn)框體在移動時只需更改DOM中每一框體存儲的絕對位置參數(shù)即可。本發(fā)明實施例可以實現(xiàn)在Portal布局的網(wǎng)頁中拖動框體時, 不產(chǎn)生相對DOM文檔流的節(jié)點移動,這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁中應(yīng)用 Flash后,拖動框體會造成Flash失效的問題,且能夠使Portal布局的網(wǎng)頁結(jié)構(gòu)更為簡單, 提高系統(tǒng)的靈活性。
圖1為本發(fā)明第一實施例的業(yè)務(wù)對象類型與科目的對應(yīng)裝置的結(jié)構(gòu)示意圖;圖2為本發(fā)明第二實施例的業(yè)務(wù)對象類型與科目的對應(yīng)裝置的結(jié)構(gòu)示意圖;圖3為本發(fā)明的業(yè)務(wù)對象類型與科目的對應(yīng)裝置的一個具體實例;圖4為本發(fā)明第三實施例的業(yè)務(wù)對象類型與科目的對應(yīng)方法的流程具體實施例方式為使本發(fā)明的目的、技術(shù)方案和優(yōu)點更加清楚,下面將結(jié)合附圖對本發(fā)明實施方式作進一步地詳細描述。實施例1本發(fā)明實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置,包括文檔對象模型模塊1,用于存儲所述頁面中每一框體的內(nèi)容以及每一框體對應(yīng)的絕對位置。
6
本發(fā)明實施例在文檔對象模型模塊存儲每一框體的內(nèi)容,并存儲每一框體對應(yīng)的在頁面中的絕對位置,以將內(nèi)容與Portal布局的頁面中每一框體實現(xiàn)一一對應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進行對應(yīng)的方式,可以實現(xiàn)框體在移動時只需更改DOM中每一框體存儲的絕對位置參數(shù)即可。本發(fā)明實施例可以實現(xiàn)在 Portal布局的網(wǎng)頁中拖動框體時,不產(chǎn)生相對DOM文檔流的節(jié)點移動,這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁中應(yīng)用Flash后,拖動框體會造成Flash失效的問題,且能夠使Portal布局的網(wǎng)頁結(jié)構(gòu)更為簡單,提高系統(tǒng)的靈活性。實施例2本發(fā)明第二實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置,其結(jié)構(gòu)如圖1所示,包括文檔對象模型模塊1,用于存儲所述頁面中每一框體的內(nèi)容以及每一框體對應(yīng)的絕對位置;絕對位置計算模塊2,用于獲取每一框體的寬度和高度,并根據(jù)頁面中的每一框體的寬度和高度計算每一框體在頁面中的絕對像素位置;位置更改計算模塊3,用于根據(jù)框體的位置更改,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。本發(fā)明第二實施例中增加了絕對位置計算模塊2和/或位置更改計算模塊3,上述兩個模塊為可選的,可以擇一或同時使用。絕對位置計算模塊2可以根據(jù)每一框體的高度和寬度計算出絕對像素位置。這樣,可以以每一網(wǎng)頁的左上角作為原點,依次根據(jù)每一框體的高度和寬度,計算出每一框體的絕對像素位置橫坐標(biāo)和縱坐標(biāo)。這種方式簡單易行,不會對造成無謂的系統(tǒng)開銷。當(dāng)然, 還可以選擇其他位置作為坐標(biāo)原點,或是采用其他方式計算絕對像素位置,本發(fā)明實施例僅為舉例說明,并不以此為限。同時,還可以使用其他方式計算框體的絕對位置,而不限定于通過絕對像素位置的方式確定框體的絕對位置。同時,框體的絕對位置也可以采用其他方式,本實施例采用絕對像素位置,只是一種舉例說明。其中,如圖3所示,絕對位置計算模塊2可以具體為框體寬度獲取單元21,用于根據(jù)預(yù)設(shè)的每一列的寬度比及頁面的寬度,計算每一框體的寬度;框體高度獲取單元22,用于通過掃描方式獲取每個框體的高度;絕對像素坐標(biāo)計算單元23,用于根據(jù)每個框體的寬度和高度,計算每個框體位于網(wǎng)頁中的絕對像素橫坐標(biāo)和縱坐標(biāo);行列關(guān)系映射單元24,用于記錄每一框體的行、列、高度,以及對應(yīng)的框體內(nèi)容 ID。由于現(xiàn)有的Portal頁面的列寬比、框體的列數(shù)、列間距是預(yù)設(shè)的,因此根據(jù)這些預(yù)設(shè)值可以計算處每一列的寬度,而該列內(nèi)每一框體的寬度都是與列寬度相等的。例如列寬比例是一個百分比數(shù)組,例如
就代表了第一列寬度占頁面寬度的20%、第二列占60%、第三列占20% ;這個數(shù)組的值的總和小于等于100% ;第 η列m行框體的寬度=(頁面總寬度_(列數(shù)+1) X間距)X第η列的列寬比例。這樣,可以簡單的通過已知參數(shù)計算出每一框體的寬度。獲得每一框體的寬度后,可以簡單的獲得框體的橫坐標(biāo)。對于高度,可以通過掃描的方式獲取。掃描頁面為一種現(xiàn)有技術(shù),在此不再贅述。 獲得了框體的寬度后,就可以簡單的獲得框體的縱坐標(biāo)。當(dāng)然,寬度也可以通過掃描的方式獲得。且寬度、高度還可以通過其他方式獲得, 本發(fā)明實施例只是舉例說明,并不以此為限。其中,行列關(guān)系映射單元24可以為一行列關(guān)系映射矩陣,該矩陣的形式可以為matrix =[[框體1,框體2],[框體5,框體6],[框體3,框體4]];上例中的矩陣只是為了舉例說明,其對應(yīng)的網(wǎng)頁有3列2行,第列中是框體1、框體 2,第二列中是框體5、框體6,第三列中是框體3、框體4。這樣,就可以對應(yīng)的獲知每一框體的行、列;然后再掃描得出的框體高度,并確定每一框體的框體內(nèi)容ID。這樣就可以將該矩陣與DOM進行對應(yīng),并使DOM獲知每一框體的橫坐標(biāo)、縱坐標(biāo)。通過矩陣這種形式可以直觀的將網(wǎng)頁中的框體表現(xiàn)出來,同時又能將每一框體對應(yīng)的參數(shù)進行存儲,以方便與DOM中的框體參數(shù)進行一一對應(yīng)。當(dāng)然,采用矩陣的方式只是本發(fā)明實施例的一個舉例說明,還可以采用其他方式, 例如列表的方式,本發(fā)明實施例并不以此為限。位置更改計算模塊3可以根據(jù)每一次的框體位置更改,重新計算每一框體的新的絕對像素位置。這種更改可以為增加一個框體、刪除一個框體、拖動一個框體以改變框體的行和/或列。例如當(dāng)用戶拖動框體時,可以通過以下方法修改每一個框體的絕對像素位置的變化101、用戶開始拖拽一個框體時,先判斷該框體是否能拖拽,若不能則將該框體回到原來位置,步驟結(jié)束;如果能則進入步驟102 ;102、用戶松開鼠標(biāo)結(jié)束拖拽時,先判斷該放手位置是否在頁面內(nèi),若不在則將該框體回到原來位置,步驟結(jié)束;如果能則進入步驟103 ;103、遍歷行列關(guān)系映射矩陣,找到用戶松開鼠標(biāo)時的位置的坐標(biāo)對應(yīng)行列位置, 也就是框體被移動到的新位置,如第η列第m行;104、將矩陣內(nèi)第η列第m行后的所有框體(包括第m行)往后移動一個位置,這些框體記錄著的行信息相應(yīng)加1 ;105、被拖拽的框體將從矩陣原來的位置移動至第η列第m行。當(dāng)用戶增加一個框體時,可以通過以下方法修改每一個框體的絕對像素位置的變化新增一個框體時,該框體將會被安排于第一列第一行,第一列原有的框體的行位置將全部加1。當(dāng)用戶刪除一個框體時,可以通過以下方法修改每一個框體的絕對像素位置的變化
刪除一個框體時,該列該框體后的所有框體的行位置將全部減1。在上述的增加、刪除、修改行為發(fā)生后,Portal布局算法會對網(wǎng)頁進行重新布局。 同時,相應(yīng)的也會修改DOM中的每一框體的絕對像素位置,在不產(chǎn)生相對DOM文檔流的節(jié)點移動的前提下任何更改Portal布局算法中的框體位置。進一步的,在框體發(fā)生變化時,修改行列關(guān)系映射單元24的行列關(guān)系映射矩陣, 并通過該矩陣實現(xiàn)對DOM的映射關(guān)系。實施例3本發(fā)明第三實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)方法,包括將頁面中每一框體與文檔對象模型的相應(yīng)條目之間,通過該框體在頁面中的絕對位置建立對應(yīng)關(guān)系。本發(fā)明實施例在文檔對象模型中,通過每一框體對應(yīng)的在頁面中的絕對位置,將頁面中的框體與DOM中的相應(yīng)的每一框體的內(nèi)容之間建立起對應(yīng)關(guān)系,以將內(nèi)容與Portal 布局的頁面中每一框體實現(xiàn)一一對應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進行對應(yīng)的方式,可以實現(xiàn)框體在移動時只需更改DOM中每一框體存儲的絕對位置參數(shù)即可。本發(fā)明實施例可以實現(xiàn)在Portal布局的網(wǎng)頁中拖動框體時,不產(chǎn)生相對 DOM文檔流的節(jié)點移動,這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁中應(yīng)用Flash后,拖動框體會造成Flash失效的問題,且能夠使Portal布局的網(wǎng)頁結(jié)構(gòu)更為簡單,提高系統(tǒng)的靈活性。實施例4本發(fā)明第四實施例提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)方法,是在第三實施例的基礎(chǔ)上改進而來,其流程如圖3所示,包括步驟201、獲取每一框體的寬度和高度,并根據(jù)頁面中的每一框體的寬度和高度計算每一框體在頁面中的絕對像素位置;步驟202、將頁面中每一框體與文檔對象模型的相應(yīng)條目之間,通過該框體在頁面中的絕對位置建立對應(yīng)關(guān)系;步驟203、當(dāng)所述框體的位置更改,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。與第三實施例相比,本實施例提出了一種計算絕對位置的方法,即通過絕對像素位置作為絕對位置,確定框體的位置。上述的步驟201和步驟203都是可選的步驟,可以擇一或同時使用。其中,步驟201公開了一種絕對像素位置計算方法,可以根據(jù)每一框體的高度和寬度計算出絕對像素位置。這樣,可以以每一網(wǎng)頁的左上角作為原點,依次根據(jù)每一框體的高度和寬度,計算出每一框體的絕對像素位置橫坐標(biāo)和縱坐標(biāo)。這種方式簡單易行,不會對造成無謂的系統(tǒng)開銷。當(dāng)然,還可以選擇其他位置作為坐標(biāo)原點,或是采用其他方式計算絕對像素位置,本發(fā)明實施例僅為舉例說明,并不以此為限。同時,還可以使用其他方式計算框體的絕對位置,而不限定于通過絕對像素位置的方式確定框體的絕對位置。同時,框體的絕對位置也可以采用其他方式,本實施例采用絕對像素位置,只是一種舉例說明。其中,步驟201可以具體為步驟2011、根據(jù)預(yù)設(shè)的每一列的寬度比及頁面的寬度,計算每一框體的寬度;
步驟2012、通過掃描方式獲取每個框體的高度;步驟2013、根據(jù)每個框體的寬度和高度,計算每個框體位于網(wǎng)頁中的絕對像素橫坐標(biāo)和縱坐標(biāo)。進一步的,還可以包括步驟2014、將該框體參數(shù)存儲,其中參數(shù)包括該框體的行、列、高度,以及對應(yīng)的絕對像素橫坐標(biāo)和縱坐標(biāo),以及對應(yīng)的框體內(nèi)容ID。由于現(xiàn)有的Portal頁面的列寬比、框體的列數(shù)、列間距是預(yù)設(shè)的,因此根據(jù)這些預(yù)設(shè)值可以計算處每一列的寬度,而該列內(nèi)每一框體的寬度都是與列寬度相等的。例如列寬比例是一個百分比數(shù)組,例如
就代表了第一列寬度占頁面寬度的20%、第二列占60%、第三列占20% ;這個數(shù)組的值的總和小于等于100% ;第 η列m行框體的寬度=(頁面總寬度_(列數(shù)+1) X間距)X第η列的列寬比例。這樣,可以簡單的通過已知參數(shù)計算出每一框體的寬度。獲得每一框體的寬度后,可以簡單的獲得框體的橫坐標(biāo)。對于高度,可以通過掃描的方式獲取。掃描頁面為一種現(xiàn)有技術(shù),在此不再贅述。 獲得了框體的寬度后,就可以簡單的獲得框體的縱坐標(biāo)。當(dāng)然,寬度也可以通過掃描的方式獲得。且寬度、高度還可以通過其他方式獲得, 本發(fā)明實施例只是舉例說明,并不以此為限。其中,步驟2014中可以通過行列關(guān)系映射矩陣存儲上述的參數(shù),該矩陣的形式可以為matrix =[[框體1,框體2],[框體5,框體6],[框體3,框體4]];上例中的矩陣只是為了舉例說明,其對應(yīng)的網(wǎng)頁有3列2行,第一列中是框體1、框體2,第二列中是框體5、框體6,第三列中是框體3、框體4。這樣,就可以對應(yīng)的獲知每一框體的行、列;然后再掃描得出的框體高度,并確定每一框體的框體內(nèi)容ID。這樣就可以將該矩陣與DOM進行對應(yīng),并使DOM獲知每一框體的橫坐標(biāo)、縱坐標(biāo)。通過矩陣這種形式可以直觀的將網(wǎng)頁中的框體表現(xiàn)出來,同時又能將每一框體對應(yīng)的參數(shù)進行存儲,以方便與DOM中的框體參數(shù)進行一一對應(yīng)。當(dāng)然,采用矩陣的方式只是本發(fā)明實施例的一個舉例說明,還可以采用其他方式, 例如列表的方式,本發(fā)明實施例并不以此為限。其中,步驟203公開了一種框體位置更改時,新的框體絕對像素位置的計算方法。 步驟203可以根據(jù)每一次的框體位置更改,重新計算每一框體的新的絕對像素位置。這種更改可以為增加一個框體、刪除一個框體、拖動一個框體以改變框體的行和/或列。例如當(dāng)用戶拖動框體時,可以通過以下方法修改每一個框體的絕對像素位置的變化101、用戶開始拖拽一個框體時,先判斷該框體是否能拖拽,若不能則將該框體回到原來位置,步驟結(jié)束;如果能則進入步驟102 ;
102、用戶松開鼠標(biāo)結(jié)束拖拽時,先判斷該放手位置是否在頁面內(nèi),若不在則將該框體回到原來位置,步驟結(jié)束;如果能則進入步驟103 ;103、遍歷行列關(guān)系映射矩陣,找到用戶松開鼠標(biāo)時的位置的坐標(biāo)對應(yīng)行列位置, 也就是框體被移動到的新位置,如第η列第m行;104、將矩陣內(nèi)第η列第m行后的所有框體(包括第m行)往后移動一個位置,這些框體記錄著的行信息相應(yīng)加1 ;105、被拖拽的框體將從矩陣原來的位置移動至第η列第m行。當(dāng)用戶增加一個框體時,可以通過以下方法修改每一個框體的絕對像素位置的變化新增一個框體時,該框體將會被安排于第一列第一行,第一列原有的框體的行位置將全部加1。當(dāng)用戶刪除一個框體時,可以通過以下方法修改每一個框體的絕對像素位置的變化刪除一個框體時,該列該框體后的所有框體的行位置將全部減1。在上述的增加、刪除、修改行為發(fā)生后,Portal布局算法會對網(wǎng)頁進行重新布局。 同時,相應(yīng)的也會修改DOM中的每一框體的絕對像素位置,在不產(chǎn)生相對DOM文檔流的節(jié)點移動的前提下任何更改Portal布局算法中的框體位置。進一步的,在框體發(fā)生變化時,修改步驟2014中的行列關(guān)系映射矩陣,并通過該矩陣實現(xiàn)對DOM的映射關(guān)系。以上實施例提供的技術(shù)方案中的全部或部分內(nèi)容可以通過軟件編程實現(xiàn),其軟件程序存儲在可讀取的存儲介質(zhì)中,存儲介質(zhì)例如計算機中的硬盤、光盤或軟盤。通過以上實施例可以看出,本發(fā)明實施例提出的Portal布局的網(wǎng)頁與文檔對象模型的對應(yīng)裝置,通過每一框體對應(yīng)的在頁面中的絕對位置,將頁面中的框體與DOM中的相應(yīng)的每一框體的內(nèi)容之間建立起對應(yīng)關(guān)系,以將內(nèi)容與Portal布局的頁面中每一框體實現(xiàn)一一對應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進行對應(yīng)的方式,可以實現(xiàn)框體在移動時只需更改DOM中每一框體存儲的絕對位置參數(shù)即可。本發(fā)明實施例可以實現(xiàn)在Portal布局的網(wǎng)頁中拖動框體時,不產(chǎn)生相對DOM文檔流的節(jié)點移動,這樣就可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁中應(yīng)用Flash后,拖動框體會造成Flash 失效的問題,且能夠使Portal布局的網(wǎng)頁結(jié)構(gòu)更為簡單,提高系統(tǒng)的靈活性。同時,還提出了絕對像素位置的計算方法和模塊,這種方式簡單易行,不會對造成無謂的系統(tǒng)開銷。還提出了當(dāng)框體位置改變時計算新的框體絕對像素位置的方法和裝置,就可以將行列關(guān)系映射矩陣與DOM進行對應(yīng),并使DOM獲知每一框體的橫坐標(biāo)、縱坐標(biāo)。通過矩陣這種形式可以直觀的將網(wǎng)頁中的框體表現(xiàn)出來,同時又能將每一框體對應(yīng)的參數(shù)進行存儲,以方便與DOM 中的框體參數(shù)進行——對應(yīng)。進一步的,本發(fā)明實施例提出了通過行列關(guān)系映射矩陣建立于DOM的對應(yīng)關(guān)系,這樣可以直觀的將網(wǎng)頁中的框體表現(xiàn)出來,同時又能將每一框體對應(yīng)的參數(shù)進行存儲,以方便與DOM中的框體參數(shù)進行一一對應(yīng)。以上僅為本發(fā)明的較佳實施例,并不用以限制本發(fā)明,凡在本發(fā)明的精神和原則之內(nèi),所作的任何修改、等同替換、改進等,均應(yīng)包含在本發(fā)明的保護范圍之內(nèi)。
1權(quán)利要求
1.一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置,包括文檔對象模型模塊,用于存儲所述頁面中每一框體的內(nèi)容以及每一框體對應(yīng)的絕對位置。
2.根據(jù)權(quán)利要求1所述的網(wǎng)頁與文檔對象模型的對應(yīng)裝置,其特征在于,所述裝置還包括絕對位置計算模塊,用于獲取每一框體的寬度和高度,并根據(jù)頁面中的每一框體的寬度和高度計算每一框體在頁面中的絕對像素位置。
3.根據(jù)權(quán)利要求2所述的網(wǎng)頁與文檔對象模型的對應(yīng)裝置,其特征在于,所述絕對位置計算模塊包括框體寬度獲取單元,用于根據(jù)預(yù)設(shè)的每一列的寬度比及頁面的寬度,計算每一框體的寬度;框體高度獲取單元,用于通過掃描方式獲取每個框體的高度;絕對像素坐標(biāo)計算單元,用于根據(jù)每個框體的寬度和高度,計算每個框體位于網(wǎng)頁中的絕對像素橫坐標(biāo)和縱坐標(biāo)。
4.根據(jù)權(quán)利要求3所述的網(wǎng)頁與文檔對象模型的對應(yīng)裝置,其特征在于,所述絕對位置計算模塊還包括行列關(guān)系映射單元,用于存儲網(wǎng)頁中每一框體的行、列、高度,以及每一框體的框體內(nèi)容ID。
5.根據(jù)權(quán)利要求2或3或4所述的網(wǎng)頁與文檔對象模型的對應(yīng)裝置,其特征在于,所述裝置還包括位置更改計算模塊,用于根據(jù)框體的位置更改,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。
6.一種網(wǎng)頁與文檔對象模型的對應(yīng)方法,其特征在于,包括將頁面中每一框體與文檔對象模型對應(yīng)條目之間通過該框體在頁面中的絕對位置建立對應(yīng)關(guān)系。
7.根據(jù)權(quán)利要求6所述的網(wǎng)頁與文檔對象模型的對應(yīng)方法,其特征在于,所述方法還包括獲取所述每一框體的寬度和高度,并根據(jù)每一框體的寬度和高度計算所述頁面中的所述每一框體的絕對像素位置。
8.根據(jù)權(quán)利要求7所述的網(wǎng)頁與文檔對象模型的對應(yīng)方法,其特征在于,所述獲取所述每一框體的寬度和高度,并根據(jù)每一框體的寬度和高度計算所述頁面中的所述每一框體的絕對像素位置包括根據(jù)預(yù)設(shè)的每一列的寬度比及頁面的寬度,計算每一框體的寬度;通過掃描方式獲取每個框體的高度;根據(jù)每個框體的寬度和高度,計算每個框體位于網(wǎng)頁中的絕對像素橫坐標(biāo)和縱坐標(biāo)。
9.根據(jù)權(quán)利要求8所述的網(wǎng)頁與文檔對象模型的對應(yīng)方法,其特征在于,所述獲取所述每一框體的寬度和高度,并根據(jù)每一框體的寬度和高度計算所述頁面中的所述每一框體的絕對像素位置還包括設(shè)置行列關(guān)系映射矩陣,并將網(wǎng)頁中每一框體的行、列、高度,以及每一框體的框體內(nèi)容ID存儲到所述行列關(guān)系映射矩陣中。
10.根據(jù)權(quán)利要求7或8或9所述的網(wǎng)頁與文檔對象模型的對應(yīng)方法,其特征在于,所述方法還包括在框體的位置更改時,獲取框體新的絕對位置,并根據(jù)所述新的絕對位置更改所述文檔對象模型模塊中每一框體對應(yīng)的絕對像素位置。
全文摘要
本發(fā)明提出了一種網(wǎng)頁與文檔對象模型的對應(yīng)裝置和方法,屬于計算機技術(shù)領(lǐng)域。本發(fā)明實施例在文檔對象模型模塊存儲每一框體的內(nèi)容,并存儲每一框體對應(yīng)的在頁面中的絕對位置,以將內(nèi)容與Portal布局的頁面中每一框體實現(xiàn)一一對應(yīng)。這種方式相比較現(xiàn)有技術(shù)中的DOM采用文檔與框體所在的行和列進行對應(yīng)的方式,可以實現(xiàn)框體在移動時只需更改DOM中每一框體存儲的絕對位置參數(shù)即可。本發(fā)明實施例可以解決現(xiàn)有技術(shù)中Portal布局的網(wǎng)頁中應(yīng)用Flash后,拖動框體會造成Flash失效的問題,且能夠使Portal布局的網(wǎng)頁結(jié)構(gòu)更為簡單,提高系統(tǒng)的靈活性。
文檔編號G06F17/30GK102200985SQ20101013975
公開日2011年9月28日 申請日期2010年3月23日 優(yōu)先權(quán)日2010年3月23日
發(fā)明者謝偉幸 申請人:深圳市金蝶中間件有限公司