亚洲成年人黄色一级片,日本香港三级亚洲三级,黄色成人小视频,国产青草视频,国产一区二区久久精品,91在线免费公开视频,成年轻人网站色直接看

一種瀏覽器頁面的顯示方法及系統(tǒng)與流程

文檔序號:11996265閱讀:399來源:國知局
一種瀏覽器頁面的顯示方法及系統(tǒng)與流程
一種瀏覽器頁面的顯示方法及系統(tǒng)【技術(shù)領(lǐng)域】本發(fā)明涉及互聯(lián)網(wǎng)的頁面排版技術(shù),尤其涉及一種瀏覽器頁面的顯示方法及系統(tǒng)。

背景技術(shù):
目前,瀏覽器頁面的排版技術(shù)中,通過將頁頭和頁腳的屬性設(shè)置為固定,使得頁頭和頁腳脫離文檔,而懸浮于文檔之上,不占用文檔,使得頁頭和頁腳不隨滾動(dòng)條而滾動(dòng);所述文檔用于規(guī)定瀏覽器頁面中顯示內(nèi)容在排版時(shí)占用的位置。瀏覽器頁面中大部分顯示對象的默認(rèn)設(shè)置是靜態(tài),即頁頭和頁腳不脫離文檔,占用文檔,屬于文檔的一部分,例如,圖1是瀏覽器頁面的結(jié)構(gòu)示意圖,如圖1所示,瀏覽器頁面中需要顯示頁頭、內(nèi)容、頁腳;如果將頁頭和頁腳設(shè)置為靜態(tài),將得到圖2所示的真實(shí)頁面,由于頁頭和頁腳占用文檔,文檔的高度等于頁頭高度、內(nèi)容高度和頁腳高度的總和,文檔的高度就超出瀏覽器窗體的高度,導(dǎo)致文檔中的部分內(nèi)容和頁腳必須通過拖動(dòng)滾動(dòng)條滾動(dòng)才能看到。為了解決這一問題,如圖3所示,可以使得頁頭和頁腳脫離文檔,頁頭和頁腳分別固定于瀏覽器窗體的頂部和底部,不作為文檔的一部分,文檔中僅包含內(nèi)容,文檔高度等于內(nèi)容高度;如此,由于頁頭和頁腳脫離文檔,則對頁面進(jìn)行排版時(shí),內(nèi)容區(qū)域不再從頁頭所占位置的底端開始,而是從文檔的起始位置開始,同理,頁腳也不會(huì)位于內(nèi)容末尾的位置,而是位于瀏覽器窗體的底端,此時(shí),瀏覽器窗體高度等于文檔高度,導(dǎo)致文檔中部分內(nèi)容被頁頭和頁腳覆蓋,無法顯示,即使拖動(dòng)滾動(dòng)條至底端,頁腳也依然覆蓋部分內(nèi)容。目前,為解決圖2和圖3所示的問題,如圖4所示,通常會(huì)設(shè)置內(nèi)容的上邊距和下邊距,在內(nèi)容前后留出等同頁頭高度和頁腳高度的空白區(qū)域,使得展示的內(nèi)容不被頁頭和頁腳覆蓋;但是這種方法必須預(yù)先獲知頁頭高度和頁腳高度;如果頁頭高度和頁腳高度未知,且依然使用該方法,則需要針對每個(gè)瀏覽器頁面設(shè)計(jì)對應(yīng)的樣式表,或在頁面代碼加載完畢后讀取頁頭高度和頁腳高度,然后根據(jù)頁頭高度和頁腳高度重設(shè)內(nèi)容的上邊距和下邊距,如此,必將產(chǎn)生額外的開發(fā)成本,且開發(fā)效率低下;開發(fā)完畢后,如果頁頭和頁腳發(fā)生變更,也將增加維護(hù)成本。此外,上述的瀏覽器頁面的排版技術(shù)應(yīng)用于計(jì)算機(jī)中比較常見,且實(shí)現(xiàn)方法非常簡單,例如設(shè)置內(nèi)容的高度固定、設(shè)置滾動(dòng)條自動(dòng)即可;但是,目前Android終端的瀏覽器中并不能支持這些簡單的設(shè)置,這樣就必須依賴第三方的JavaScript框架來解決問題,JavaScript框架在解決問題的同時(shí),還將帶來額外的資源開銷,而且實(shí)現(xiàn)滾動(dòng)的JavaScript框架中的iscroll框架在解決問題時(shí),實(shí)現(xiàn)過程比較復(fù)雜,很容易與瀏覽器會(huì)發(fā)生沖突,從而導(dǎo)致整個(gè)瀏覽器的崩潰。

技術(shù)實(shí)現(xiàn)要素:
本發(fā)明提供了一種瀏覽器頁面的顯示方法及系統(tǒng),能夠提高瀏覽器頁面的開發(fā)效率,降低開發(fā)成本。本發(fā)明的具體技術(shù)方案如下:根據(jù)本發(fā)明一優(yōu)選實(shí)施例,一種瀏覽器頁面的顯示方法,包括:對預(yù)設(shè)的頁面代碼文件進(jìn)行解析和渲染,得到顯示的頁面;所述頁面包含第一頁頭、第一頁腳和文檔,所述文檔包括第二頁頭、內(nèi)容和第二頁腳,所述第一頁頭和第一頁腳的屬性為不占用文檔,所述第二頁頭和第二頁腳的屬性為占用文檔。上述方法中,在所述對預(yù)設(shè)的頁面代碼文件進(jìn)行解析和渲染之前,該方法還包括:復(fù)制頁面代碼文件中的第一頁頭代碼和第一頁腳代碼,得到第二頁頭代碼和第二頁腳代碼的頁面代碼文件;其中所述第一頁頭代碼和第一頁腳代碼中,第一頁頭和第一頁腳的定位屬性為固定,在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。上述方法中,所述復(fù)制頁面代碼文件中的頁頭代碼和頁腳代碼為:接收用戶對原始頁面代碼文件中的第一頁頭代碼和第一頁腳代碼分別進(jìn)行復(fù)制后得到的第二頁頭代碼和第二頁腳代碼。上述方法中,所述復(fù)制頁面代碼文件中的頁頭代碼和頁腳代碼為:編譯器根據(jù)輸入的路徑找到所述頁面代碼文件,所述頁面代碼文件中包含具有復(fù)制標(biāo)識(shí)符的第一頁頭代碼和第一頁腳代碼,在對所述頁面代碼文件進(jìn)行編譯時(shí),依據(jù)所述復(fù)制標(biāo)識(shí)符對所述第一頁頭代碼和第一頁腳代碼進(jìn)行復(fù)制得到第二頁頭代碼和第二頁腳代碼。上述方法中,該方法還包括:在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的顯示特性屬性設(shè)置為隱藏;其中,所述顯示特性屬性為隱藏的第二頁頭和第二頁腳不顯示在瀏覽器窗體中。上述方法中,所述對預(yù)設(shè)的頁面代碼文件進(jìn)行解析為:對所述頁面代碼文件進(jìn)行解析,得到顯示對象,復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象,得到第二頁頭對象和第二頁腳對象;其中所述第一頁頭對象和第一頁腳對象的樣式表中,第一頁頭和第一頁腳的定位屬性為固定,在第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),其中,所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。上述方法中,所述復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象為:依據(jù)收到的命令及所述命令中指示的顯示對象,對第一頁頭對象和第一頁腳對象進(jìn)行復(fù)制;在所述顯示對象組成的DOM樹上創(chuàng)建新的分支,所述新的分支與第一頁頭對象和第一頁腳對象的分支同級;將復(fù)制得到的第二頁頭對象和第二頁腳對象作為新的分支的葉子節(jié)點(diǎn)。上述方法中,該方法還包括:在所述第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的顯示特性屬性設(shè)置為隱藏;其中,所述顯示特性屬性為隱藏的第二頁頭和第二頁腳不顯示在瀏覽器窗體中。本發(fā)明還提供一種瀏覽器頁面的顯示系統(tǒng),包括瀏覽器;所述瀏覽器包括解析單元和渲染單元;其中,解析單元,用于對預(yù)設(shè)的頁面代碼文件進(jìn)行解析;渲染單元,用于對解析單元解析后的頁面代碼文件進(jìn)行渲染,得到顯示的頁面;所述頁面包含第一頁頭、第一頁腳和文檔,所述文檔包括第二頁頭、內(nèi)容和第二頁腳,所述第一頁頭和第一頁腳的屬性為不占用文檔,所述第二頁頭和第二頁腳的屬性為占用文檔。上述系統(tǒng)中,該系統(tǒng)還包括:復(fù)制單元,用于復(fù)制頁面代碼文件中的第一頁頭代碼和第一頁腳代碼,得到第二頁頭代碼和第二頁腳代碼的頁面代碼文件;其中所述第一頁頭代碼和第一頁腳代碼中,第一頁頭和第一頁腳的定位屬性為固定,在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。上述系統(tǒng)中,所述復(fù)制單元位于瀏覽器時(shí),復(fù)制單元在復(fù)制頁面代碼文件中的頁頭代碼和頁腳代碼時(shí),具體為:接收用戶對原始頁面代碼文件中的第一頁頭代碼和第一頁腳代碼分別進(jìn)行復(fù)制后得到的第二頁頭代碼和第二頁腳代碼。上述系統(tǒng)中,所述復(fù)制單元位于編譯器時(shí),所述復(fù)制單元在復(fù)制頁面代碼文件中的頁頭代碼和頁腳代碼時(shí),具體為:根據(jù)輸入的路徑找到所述頁面代碼文件,所述頁面代碼文件中包含具有復(fù)制標(biāo)識(shí)符的第一頁頭代碼和第一頁腳代碼,在對所述頁面代碼文件進(jìn)行編譯時(shí),依據(jù)所述復(fù)制標(biāo)識(shí)符對所述第一頁頭代碼和第一頁腳代碼進(jìn)行復(fù)制得到第二頁頭代碼和第二頁腳代碼。上述系統(tǒng)中,所述復(fù)制單元,還用于在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的顯示特性屬性設(shè)置為隱藏;其中,所述顯示特性屬性為隱藏的第二頁頭和第二頁腳不顯示在瀏覽器窗體中。上述系統(tǒng)中,所述解析單元進(jìn)一步包括:解析子單元和復(fù)制子單元;其中,所述解析子單元,用于對所述頁面代碼文件進(jìn)行解析,得到顯示對象;所述復(fù)制子單元,用于復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象,得到第二頁頭對象和第二頁腳對象;其中所述第一頁頭對象和第一頁腳對象的樣式表中,第一頁頭和第一頁腳的定位屬性為固定;還用于在第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),其中,所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。上述系統(tǒng)中,所述復(fù)制子單元在復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象時(shí),具體為:依據(jù)收到的命令及所述命令中指示的顯示對象,對第一頁頭對象和第一頁腳對象進(jìn)行復(fù)制;在所述顯示對象組成的DOM樹上創(chuàng)建新的分支,所述新的分支與第一頁頭對象和第一頁腳對象的分支同級;將復(fù)制得到的第二頁頭對象和第二頁腳對象作為新的分支的葉子節(jié)點(diǎn)。上述系統(tǒng)中,所述復(fù)制子單元,還用于在所述第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的顯示特性屬性設(shè)置為隱藏;其中,所述顯示特性屬性為隱藏的第二頁頭和第二頁腳不顯示在瀏覽器窗體中。由以上技術(shù)方案可以看出,本發(fā)明提供的具有以下有益效果:原始的頁頭和頁腳作為真實(shí)的頁頭和頁腳用于顯示,復(fù)制出的頁頭和頁腳作為虛擬的頁頭和頁腳在文檔中占位,在預(yù)先不知道頁頭高度和頁腳高度的前提下,既能夠避免原始的頁頭和頁腳覆蓋住文檔的內(nèi)容,又可以保證顯示的頁面中同時(shí)具有頁頭和頁腳,降低頁面的開發(fā)成本和維護(hù)成本,提高開發(fā)效率。【附圖說明】圖1是瀏覽器頁面的結(jié)構(gòu)示意圖;圖2是瀏覽器頁面的第一顯示示意圖;圖3是瀏覽器頁面的第二顯示示意圖;圖4是瀏覽器頁面的第三顯示示意圖;圖5是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的顯示方法的優(yōu)選實(shí)施例一的流程示意圖;圖6是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的顯示方法的優(yōu)選實(shí)施例二的流程示意圖;圖7是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的顯示系統(tǒng)的優(yōu)選實(shí)施例一的結(jié)構(gòu)示意圖;圖8是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的顯示系統(tǒng)的優(yōu)選實(shí)施例二的結(jié)構(gòu)示意圖;圖9是經(jīng)典示例中移動(dòng)會(huì)員卡內(nèi)部的詳情及列表頁的篩選項(xiàng)打開前的示意圖;圖10是經(jīng)典示例中移動(dòng)會(huì)員卡內(nèi)部的詳情及列表頁的篩選項(xiàng)打開后的示意圖?!揪唧w實(shí)施方式】為了使本發(fā)明的目的、技術(shù)方案和優(yōu)點(diǎn)更加清楚,下面結(jié)合附圖和具體實(shí)施例對本發(fā)明進(jìn)行詳細(xì)描述。本發(fā)明提供一種瀏覽器頁面的顯示方法,該方法包括:對預(yù)設(shè)的頁面代碼文件進(jìn)行解析和渲染,得到顯示的頁面;所述頁面包括第一頁頭、第一頁腳和文檔,所述文檔包括第二頁頭、內(nèi)容和第二頁腳,所述第一頁頭和第一頁腳的屬性為不占用文檔,所述第二頁頭和第二頁腳的屬性為占用文檔。圖5是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的顯示方法的優(yōu)選實(shí)施例一的流程示意圖,如圖5所示,該優(yōu)選實(shí)施例包括以下步驟:步驟501,復(fù)制頁面代碼文件中的第一頁頭代碼和第一頁腳代碼,得到第二頁頭代碼和第二頁腳代碼的頁面代碼文件;其中所述第一頁頭代碼和第一頁腳代碼中,第一頁頭和第一頁腳的定位屬性為固定,在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。具體的,在生成頁面代碼文件過程中,瀏覽器接收用戶在頁面代碼文件中輸入的兩個(gè)相同的頁頭代碼和兩個(gè)相同的頁腳代碼,其中,第一頁頭代碼和第一頁腳代碼分別為用戶輸入的原始頁頭代碼和原始頁腳代碼,第二頁頭代碼和第二頁腳代碼分別為復(fù)制出的第一頁頭代碼和復(fù)制出的第一頁腳代碼,第二頁頭代碼和第二頁腳代碼是用戶對第一頁頭代碼和第一頁腳代碼進(jìn)行復(fù)制后輸入到頁面代碼文件中的;或,在生成頁面代碼文件后,對頁面代碼文件中需要編譯的代碼添加特定標(biāo)識(shí)符,例如,對頁面代碼文件中的第一頁頭代碼和第一頁腳代碼添加復(fù)制標(biāo)識(shí)符;用戶將需要編譯的頁面代碼文件統(tǒng)一上傳到后端服務(wù)器的特定目錄下,編譯器根據(jù)用戶輸入的路徑找到需要編譯的頁面代碼文件,編譯器對添加特定標(biāo)識(shí)符的頁面代碼文件進(jìn)行編譯,如果頁面代碼文件中第一頁頭代碼和第一頁腳代碼添加有復(fù)制標(biāo)識(shí)符,則編譯器對添加有復(fù)制標(biāo)識(shí)符的第一頁頭代碼和第一頁腳代碼進(jìn)行復(fù)制;編譯器對頁面代碼文件進(jìn)行編譯后,輸出編譯后的頁面代碼文件,本實(shí)施例中,編譯器輸出的頁面代碼文件中將包含兩個(gè)相同的頁頭代碼和兩個(gè)相同的頁腳代碼,其中第一頁頭代碼和第一頁腳代碼分別用戶輸入的原始頁頭代碼和原始頁腳代碼,第二頁頭代碼和第二頁腳代碼分別為編譯器自身復(fù)制出的第一頁頭代碼和復(fù)制出的第一頁腳代碼;如此,對包括兩個(gè)相同的頁頭代碼和兩個(gè)相同的頁腳代碼的頁面代碼文件進(jìn)行解析和渲染后,得到的頁面中將存在兩個(gè)頁頭和兩個(gè)頁腳;本發(fā)明優(yōu)選實(shí)施例中,用戶為瀏覽器頁面的開發(fā)人員。在第二頁頭代碼和第二頁腳代碼中,對第二頁頭和第二頁腳的相關(guān)屬性進(jìn)行重置,包括定位屬性和顯示特性屬性的重置;其中,定位屬性的重置是將第二頁頭和第二頁腳的定位屬性重置為靜態(tài),由于第一頁頭代碼和第一頁腳代碼中position字段的默認(rèn)賦值為fixed,表示定位屬性為固定,那么復(fù)制得到的第二頁頭和第二頁腳的定位屬性也為固定,默認(rèn)為脫離文檔,對頁面代碼文件加載后,第二頁頭和第二頁尾在瀏覽器窗體中位置固定,本實(shí)施例中,需要將第二頁頭代碼和第二頁腳代碼中的position字段的賦值由fixed改為static,表示第二頁頭和第二頁腳的定位屬性為靜態(tài),即第二頁頭和第二頁腳不脫離文檔,即占用文檔,對頁面代碼文件加載后,第二頁頭和第二頁尾屬于文檔的一部分,并在文檔中位置固定,且位于文檔的兩端;顯示特性屬性的重置是將第二頁頭和第二頁尾的顯示特性屬性重置為隱藏,由于第一頁頭代碼和第一頁腳代碼中visibility字段的默認(rèn)賦值為空,對頁面代碼文件加載后,第一頁頭和第一頁腳可以在瀏覽器窗體中顯示,本實(shí)施例中,需要將復(fù)制得到的第二頁頭代碼和第二頁腳代碼中的visibility字段的賦值由空改為hidden,即第二頁頭和第二頁腳不顯示,對頁面代碼文件加載后,第二頁頭和第二頁腳在瀏覽器窗體中并不顯示,文檔的內(nèi)容上方和內(nèi)容下方將為空白,上方的空白為占用文檔但不顯示的第二頁頭,下方的空白為占用文檔但不顯示的第二頁腳;這里,顯示特性屬性的重置是可選操作,為了達(dá)到更好的視覺效果,可以將第二頁頭和第二頁腳的顯示特性屬性重置為隱藏。步驟502,解析并渲染包含兩個(gè)頁頭代碼和兩個(gè)頁腳代碼的頁面代碼文件,得到顯示的頁面;所述第一頁頭和第一頁腳的屬性為不占用文檔,所述第二頁頭和第二頁腳的屬性為占用文檔。具體的,首先,瀏覽器接收用戶輸入的文件地址,根據(jù)該文件地址在后端服務(wù)器中找到對應(yīng)的頁面代碼文件;其次,瀏覽器對找到的包括兩個(gè)頁頭代碼和兩個(gè)頁腳代碼的頁面代碼文件進(jìn)行解析,得到DOM樹;然后;瀏覽器對解析得到的文件對象模型(DOM,DocumentObjectModel)樹進(jìn)行渲染,得到顯示的頁面;其中,DOM樹是頁面中多個(gè)顯示對象的組成形式,DOM樹用于限制頁面代碼文件中代碼間的邏輯關(guān)系及屬性;其中,由于第一頁頭代碼和第一頁腳代碼中,第一頁頭和第一頁腳的定位屬性默認(rèn)為固定,因此,第一頁頭和第一頁腳脫離文檔,瀏覽器解析并渲染頁面代碼文件后,第一頁頭和第一頁腳在瀏覽器窗體中位置固定;而第二頁頭代碼和第二頁腳代碼中,第二頁頭和第二頁腳的定位屬性為靜態(tài),因此,第二頁頭和第二頁腳不脫離文檔,即占用文檔,對頁面代碼文件解析并渲染后,第二頁頭和第二頁腳屬于文檔的一部分,在文檔中位置固定,且分別固定于文檔的兩端;由于定位屬性為固定的第一頁頭和第二頁腳的顯示層級別高于定位屬性為靜態(tài)的第二頁頭和第二頁腳的顯示層級別,因此第一頁頭和第一頁腳默認(rèn)的將顯示在第二頁頭和第而頁腳的上層,但由于第二頁頭和第二頁腳屬于文檔的一部分且顯示特性屬性為不顯示,第二頁頭和第二頁腳作為虛擬的頁頭和頁腳位于文檔的兩端,使得文檔中的兩端是空白的,當(dāng)?shù)诙擃^位于瀏覽器窗體頂端時(shí),即使第二頁頭覆蓋文檔,也僅覆蓋文檔中虛擬的第二頁頭,即覆蓋住文檔頂端的空白部分,沒有覆蓋文檔中的內(nèi)容,同理,當(dāng)?shù)诙撃_位于瀏覽器底端時(shí),即使第一頁腳覆蓋文檔,也僅覆蓋住文檔中虛擬的第二頁腳,即覆蓋住文檔中底端的空白部分,沒有覆蓋住文檔中的內(nèi)容。圖6是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的排版方法的優(yōu)選實(shí)施例二的流程示意圖,如圖6所示,該優(yōu)選實(shí)施例包括以下步驟:步驟601,對預(yù)設(shè)的頁面代碼文件進(jìn)行解析,得到顯示對象,復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象,得到第二頁頭對象和第二頁腳對象;其中所述第一頁頭對象和第一頁腳對象的樣式表中,第一頁頭和第一頁腳的定位屬性為固定,在第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),其中,所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。具體的,瀏覽器接收用戶輸入的文件地址,根據(jù)該文件地址在后端服務(wù)器中找到對應(yīng)的頁面代碼文件;瀏覽器對找到的頁面代碼文件進(jìn)行解析,得到DOM樹;其中,DOM樹是頁面中多個(gè)顯示對象的組成形式;用戶通過HTML方式調(diào)用JavaScript腳本提供的接口函數(shù)DomObject.cloneNode(),向?yàn)g覽器發(fā)送命令;瀏覽器依據(jù)收到的命令及該命令中指示的顯示對象,獲知需要對第一頁頭對象和第一頁腳對象進(jìn)行復(fù)制;瀏覽器在所述DOM樹上創(chuàng)建一個(gè)新的分支,新的分支與第一頁頭對象和第一頁腳對象的分支是同級分支,復(fù)制得到的第二頁頭對象和第二頁腳對象作為新的分支的葉子節(jié)點(diǎn),如此,DOM樹具有兩個(gè)相同的頁頭對象和兩個(gè)相同的頁腳對象。在第二頁頭對象和第二頁腳對象的樣式表中,對第二頁頭和第二頁腳的相關(guān)屬性進(jìn)行重置,包括定位屬性和顯示特性屬性的重置;其中,將第二頁頭對象和第二頁腳對象的樣式表中的position字段的賦值由默認(rèn)的fixed改為static,表示第二頁頭和第二頁腳的定位屬性為靜態(tài),即第二頁頭和第二頁腳不脫離文檔,占用文檔,在瀏覽器對DOM樹渲染后,第二頁頭和第二頁腳屬于文檔的一部分,并在文檔中位置固定,且位于文檔的兩端;將第二頁頭對象和第二頁腳對象的樣式表中的visibility字段的賦值由默認(rèn)的空改為hidden,即第二頁頭和第二頁腳不顯示,在瀏覽器對DOM樹渲染后,第二頁頭和第二頁腳在瀏覽器窗體中并不顯示,文檔的內(nèi)容上方和內(nèi)容下方將為空白,上方的空白為占用文檔但不顯示的第二頁頭,下方的空白為占用文檔但不顯示的第二頁腳;這里,顯示特性屬性的重置是可選操作,為了達(dá)到更好的視覺效果,可以將第二頁頭和第二頁腳的顯示特性屬性重置為隱藏。步驟602,對解析得到的顯示對象進(jìn)行渲染,得到顯示的頁面;所述第一頁頭和第一頁腳的屬性為不占用文檔,所述第二頁頭和第二頁腳的屬性為占用文檔。具體的,瀏覽器在對頁面代碼文件進(jìn)行解析并得到兩個(gè)相同的頁頭對象和頁腳對象后,對DOM樹進(jìn)行渲染,得到顯示的頁面;其中,第一頁頭和第一頁腳脫離文檔,得到顯示的頁面后,第一頁頭和第一頁腳在瀏覽器窗體中位置固定;第二頁頭對象和第二頁腳對象中,第二頁頭和第二頁腳的定位屬性為靜態(tài),第二頁頭和第二頁腳不脫離文檔,即占用文檔,得到頁面后,第二頁頭和第二頁腳屬于文檔的一部分,在文檔中固定,且分別固定于文檔的兩端;當(dāng)?shù)诙擃^位于瀏覽器窗體頂端時(shí),第一頁頭覆蓋文檔中虛擬的第二頁頭,沒有覆蓋文檔中的內(nèi)容,同理,當(dāng)?shù)诙撃_位于瀏覽器底端時(shí),第一頁腳覆蓋文檔中虛擬的第二頁腳,沒有覆蓋住文檔中的內(nèi)容。上述優(yōu)選實(shí)施例中,原始的頁頭和頁腳作為真實(shí)的頁頭和頁腳用于顯示,復(fù)制出的頁頭和頁腳作為虛擬的頁頭和頁腳在文檔中占位,在預(yù)先不知道頁頭高度和頁腳高度的前提下,既能夠避免原始的頁頭和頁腳覆蓋住文檔的內(nèi)容,又可以保證顯示的頁面中同時(shí)具有頁頭和頁腳,降低頁面的開發(fā)成本和維護(hù)成本,提高開發(fā)效率;此外,由于不利用JavaScript框架,或僅利用JavaScript框架進(jìn)行顯示對象的復(fù)制,操作簡單,因此將上述技術(shù)方案應(yīng)用于Android終端時(shí),也不會(huì)與瀏覽器發(fā)生沖突,避免瀏覽器發(fā)生崩潰;此外,利用編譯器對頁頭代碼和頁腳代碼進(jìn)行復(fù)制,以及瀏覽器對頁頭對象和頁腳對象進(jìn)行復(fù)制的方案時(shí),如果需要對頁頭和頁腳的內(nèi)容進(jìn)行調(diào)整,則可以僅修改原始的頁頭和頁腳,編譯器或?yàn)g覽器會(huì)自動(dòng)對修改后的頁頭和頁腳進(jìn)行復(fù)制,能夠減少維護(hù)成本,提高開發(fā)效率。為實(shí)現(xiàn)上述方法,本發(fā)明還提供一種瀏覽器頁面的排版系統(tǒng),圖7是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的排版系統(tǒng)的優(yōu)選實(shí)施例一的結(jié)構(gòu)示意圖,圖8是本發(fā)明實(shí)現(xiàn)瀏覽器頁面的排版系統(tǒng)的優(yōu)選實(shí)施例二的結(jié)構(gòu)示意圖,如圖7和圖8所示,該系統(tǒng)包括瀏覽器;所述瀏覽器包括解析單元11和渲染單元12;其中,解析單元11,用于對預(yù)設(shè)的頁面代碼文件進(jìn)行解析;渲染單元12,用于對解析單元11解析后的頁面代碼文件進(jìn)行渲染,得到顯示的頁面;所述頁面包含第一頁頭、第一頁腳和文檔,所述第一頁頭和第一頁腳的屬性為不占用文檔,所述第二頁頭和第二頁腳的屬性為占用文檔。如圖7所示,該系統(tǒng)還包括:復(fù)制單元13,用于復(fù)制頁面代碼文件中的第一頁頭代碼和第一頁腳代碼,得到第二頁頭代碼和第二頁腳代碼的頁面代碼文件;其中所述第一頁頭代碼和第一頁腳代碼中,第一頁頭和第一頁腳的定位屬性為固定,在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。其中,所述復(fù)制單元13位于瀏覽器時(shí),復(fù)制單元13在復(fù)制頁面代碼文件中的頁頭代碼和頁腳代碼時(shí),具體為:接收用戶對原始頁面代碼文件中的第一頁頭代碼和第一頁腳代碼分別進(jìn)行復(fù)制后得到的第二頁頭代碼和第二頁腳代碼。其中,所述復(fù)制單元13位于編譯器時(shí),所述復(fù)制單元13在復(fù)制頁面代碼文件中的頁頭代碼和頁腳代碼時(shí),具體為:根據(jù)輸入的路徑找到所述頁面代碼文件,所述頁面代碼文件中包含具有復(fù)制標(biāo)識(shí)符的第一頁頭代碼和第一頁腳代碼,在對所述頁面代碼文件進(jìn)行編譯時(shí),依據(jù)所述復(fù)制標(biāo)識(shí)符對所述第一頁頭代碼和第一頁腳代碼進(jìn)行復(fù)制得到第二頁頭代碼和第二頁腳代碼。其中,所述復(fù)制單元13,還用于在第二頁頭代碼和第二頁腳代碼中,將第二頁頭和第二頁腳的顯示特性屬性設(shè)置為隱藏;其中,所述顯示特性屬性為隱藏的第二頁頭和第二頁腳不顯示在瀏覽器窗體中。如圖8所示,所述解析單元11進(jìn)一步包括解析子單元110,復(fù)制子單元112;其中,所述解析子單元110,用于對所述頁面代碼文件進(jìn)行解析,得到顯示對象;所述復(fù)制子單元112,用于復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象,得到第二頁頭對象和第二頁腳對象;其中所述第一頁頭對象和第一頁腳對象的樣式表中,第一頁頭和第一頁腳的定位屬性為固定;還用于在所述第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的定位屬性設(shè)置為靜態(tài),其中,所述定位屬性為靜態(tài)的第二頁頭和第二頁腳占用文檔。其中,所述復(fù)制子單元112在復(fù)制顯示對象中的第一頁頭對象和第一頁腳對象時(shí),具體為:依據(jù)收到的命令及所述命令中指示的顯示對象,對第一頁頭對象和第一頁腳對象進(jìn)行復(fù)制;在所述顯示對象組成的DOM樹上創(chuàng)建新的分支,所述新的分支與第一頁頭對象和第一頁腳對象的分支同級;將復(fù)制得到的第二頁頭對象和第二頁腳對象作為新的分支的葉子節(jié)點(diǎn)。其中,所述復(fù)制子單元112,還用于在所述第二頁頭對象和第二頁腳對象的樣式表中,將第二頁頭和第二頁腳的顯示特性屬性設(shè)置為隱藏;其中,所述顯示特性屬性為隱藏的第二頁頭和第二頁腳不顯示在瀏覽器窗體中。例如,經(jīng)典示例為移動(dòng)會(huì)員卡內(nèi)部的詳情及列表頁,如圖9所示,其中,列表為內(nèi)容,上方篩選項(xiàng)等信息為頁頭,下方狀態(tài)欄為頁腳,可以看到內(nèi)容的多少不會(huì)影響頁面的整體布局的變化,如圖10所示,與圖9相比,圖10中的頁頭中篩選項(xiàng)打開后,內(nèi)容區(qū)域的尺寸發(fā)生了變化,但整體布局和頁面的尺寸并未變化,在android終端中可以拖動(dòng)頁面中內(nèi)容進(jìn)行滾動(dòng),只有內(nèi)容中的列表項(xiàng)隨頁面發(fā)生滾動(dòng)。以上所述僅為本發(fā)明的較佳實(shí)施例而已,并不用以限制本發(fā)明,凡在本發(fā)明的精神和原則之內(nèi),所做的任何修改、等同替換、改進(jìn)等,均應(yīng)包含在本發(fā)明保護(hù)的范圍之內(nèi)。
當(dāng)前第1頁1 2 3 
網(wǎng)友詢問留言 已有0條留言
  • 還沒有人留言評論。精彩留言會(huì)獲得點(diǎn)贊!
1