一種模板頁面編輯系統(tǒng)及方法
【專利摘要】本發(fā)明公開了一種模板頁面編輯系統(tǒng)及方法，涉及數(shù)據(jù)處理技術(shù)領(lǐng)域。所述系統(tǒng)包括：模板頁存儲分析單元、頁面建立單元、編輯子系統(tǒng)和發(fā)布單元。所述方法：選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面添加到模板頁面記錄中，載入建立的頁面，當(dāng)鼠標(biāo)經(jīng)過html頁中被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，獲得與可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器并加載，讀取并編輯可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼，發(fā)布并生成.html文件。本發(fā)明使定制的編輯器能夠被復(fù)用，能更快、更多的滿足各種類型的模板頁面；明顯減少模板頁面編輯系統(tǒng)編輯器的開發(fā)工作量，提高模板頁面開發(fā)人員的工作效率，減少溝通成本。
【專利說明】
一種模板頁面編輯系統(tǒng)及方法
技術(shù)領(lǐng)域
[0001]本發(fā)明涉及數(shù)據(jù)處理技術(shù)領(lǐng)域，尤其涉及一種模板頁面編輯系統(tǒng)及方法。
【背景技術(shù)】
[0002]現(xiàn)有模板頁面編輯系統(tǒng)通常把目標(biāo)模板頁面拆分成板塊，然后針對每個板塊內(nèi)容開發(fā)相應(yīng)的編輯器，在編輯時調(diào)出相應(yīng)板塊編輯器進(jìn)行內(nèi)容編輯。而現(xiàn)有系統(tǒng)存在的以下不足:要求根據(jù)每個模板頁面拆分后的板塊定制的編輯器耦合度高，造成定制的編輯器使用局限性及難以復(fù)用，故需要開發(fā)大量的編輯器支撐每個模板頁面的內(nèi)容編輯，然后，在增設(shè)新增模板時，還需要耗費額外人力和時間開發(fā)與新增模板對應(yīng)的新增板塊編輯器，這種方式無疑難以應(yīng)對大規(guī)模不同內(nèi)容的模頁面開發(fā)使用。

【發(fā)明內(nèi)容】

[0003]本發(fā)明的目的在于提供一種模板頁面編輯系統(tǒng)及方法，從而解決現(xiàn)有技術(shù)中存在的前述問題。
[0004]為了實現(xiàn)上述目的，本發(fā)明所述模板頁面編輯系統(tǒng)，該系統(tǒng)包括:
[0005]模板頁存儲分析單元，分析html頁，對html頁上的可編輯元素進(jìn)行性質(zhì)標(biāo)識后存儲；
[0006]頁面建立單元，從模板頁存儲分析單元選擇任意一個html頁作為初始頁面添加到新創(chuàng)建的模板頁面記錄中，完成頁面的建立；
[0007]編輯子系統(tǒng)，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，當(dāng)鼠標(biāo)經(jīng)過被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，查找并獲得與所述可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器，加載所述編輯器，讀取并編輯所述可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼，并上傳到服務(wù)器端并更新到數(shù)據(jù)庫中；
[0008]發(fā)布單元，從數(shù)據(jù)庫中獲得所述源碼，發(fā)布并生成.html文件。
[0009]優(yōu)選地，每類可編輯元素對應(yīng)唯一的性質(zhì)標(biāo)識，且每一個性質(zhì)標(biāo)識與一個編輯器——對應(yīng)設(shè)置。
[0010]優(yōu)選地，所述系統(tǒng)還包括:編輯器存儲單元，用于存儲編輯可編輯元素中內(nèi)容所用到的編輯器。
[0011]優(yōu)選地，所述編輯器包括文本編輯器和圖形編輯器。
[0012]優(yōu)選地，所述編輯子系統(tǒng)包括:判斷單元、分析查找單元、編輯單元和上傳單元；
[0013]判斷單元，負(fù)責(zé)監(jiān)聽JS鼠標(biāo)移動事件，并判斷鼠標(biāo)當(dāng)前所在區(qū)域是否為被標(biāo)記過性質(zhì)標(biāo)識的可編輯元素A的內(nèi)容編輯區(qū)，如果是，則將可編輯元素A及其信息發(fā)送給分析單元;如果否，則繼續(xù)判斷；
[0014]分析查找單元，分析并獲取所述可編輯元素A的性質(zhì)標(biāo)識，查找與所述性質(zhì)標(biāo)識對應(yīng)的編輯器；
[0015]編輯單元，加載所述編輯器，讀取所述可編輯元素A中記載的初始內(nèi)容，按照操作人員的指令對所述初始內(nèi)容進(jìn)行編輯，將編輯后的內(nèi)容更新到可編輯元素A中，并獲得當(dāng)前可編輯元素A中所有內(nèi)容所對應(yīng)的源碼；
[0016]上傳單元，將源碼上傳到服務(wù)器端并更新到數(shù)據(jù)庫中。
[0017]優(yōu)選地，所述數(shù)據(jù)庫還存儲標(biāo)記過性質(zhì)標(biāo)識的HTML頁。
[0018]本發(fā)明所述基于模板頁面編輯系統(tǒng)的模板頁面編輯方法，該方法包括:
[0019]SI，選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面添加到模板頁面記錄中，完成頁面的建立；
[0020]S2，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，當(dāng)鼠標(biāo)經(jīng)過html頁中被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，查找并獲得與所述可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器，加載所述編輯器，讀取并編輯所述可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼；
[0021 ] S3,從數(shù)據(jù)庫中獲得所述源碼，發(fā)布并生成.html文件。
[0022 ] 優(yōu)選地，在步驟SI之前還包括以下步驟:分析html頁，對html頁上的可編輯元素進(jìn)行性質(zhì)標(biāo)識，將標(biāo)識過的html頁存儲到數(shù)據(jù)庫中，從所述數(shù)據(jù)庫中選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面。
[0023]優(yōu)選地，步驟S2，具體按照下述步驟實現(xiàn):
[0024]S21，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，判斷鼠標(biāo)當(dāng)前所在區(qū)域是否為被標(biāo)記過性質(zhì)標(biāo)識的可編輯元素A的內(nèi)容編輯區(qū)，如果是，則進(jìn)入S22;如果否，則返回S21;
[0025]S22，分析并獲取所述可編輯元素A的性質(zhì)標(biāo)識，查找與所述性質(zhì)標(biāo)識對應(yīng)的編輯器；
[0026]S23，加載所述編輯器，讀取所述可編輯元素A中記載的初始內(nèi)容，按照操作人員的指令對所述初始內(nèi)容進(jìn)行編輯，將編輯后的內(nèi)容更新到可編輯元素A中，并獲得當(dāng)前可編輯元素A中所有內(nèi)容所對應(yīng)的源碼；
[0027]S24，將源碼上傳到服務(wù)器端并更新到數(shù)據(jù)庫中。
[0028]本發(fā)明的有益效果是:
[0029]本發(fā)明所述系統(tǒng)過對模板內(nèi)容性質(zhì)識別的方案去定制通用編輯器，如文字編輯器和圖片編輯器，使定制的編輯器能夠被復(fù)用，能更快、更多的滿足各種類型的模板頁面；明顯減少模板頁面編輯系統(tǒng)編輯器的開發(fā)工作量，提高模板頁面開發(fā)人員的工作效率，減少溝通成本，模板頁面開發(fā)人員可根據(jù)所述系統(tǒng)提供的模版自行制作頁面。
【附圖說明】
[0030]圖1是模板頁面編輯系統(tǒng)的結(jié)構(gòu)示意圖；
[0031 ]圖2是模板頁面編輯方法的流程示意圖。
【具體實施方式】
[0032]為了使本發(fā)明的目的、技術(shù)方案及優(yōu)點更加清楚明白，以下結(jié)合附圖，對本發(fā)明進(jìn)行進(jìn)一步詳細(xì)說明。應(yīng)當(dāng)理解，此處所描述的【具體實施方式】僅僅用以解釋本發(fā)明，并不用于限定本發(fā)明。
[0033]實施例
[0034]本實施例所述模板頁面編輯系統(tǒng)，該系統(tǒng)包括:
[0035]模板頁存儲分析單元，分析html頁，對html頁上的可編輯元素進(jìn)行性質(zhì)標(biāo)識后存儲；
[0036]頁面建立單元，從模板頁存儲分析單元選擇任意一個html頁作為初始頁面添加到新創(chuàng)建的模板頁面記錄中，完成頁面的建立；
[0037]編輯子系統(tǒng)，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，當(dāng)鼠標(biāo)經(jīng)過被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，查找并獲得與所述可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器，加載所述編輯器，讀取并編輯所述可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼，上傳到服務(wù)器端并更新到數(shù)據(jù)庫中；
[0038]發(fā)布單元，從數(shù)據(jù)庫中獲得所述源碼，發(fā)布并生成.html文件。
[0039]更詳細(xì)的解釋說明為:
[0040](— )每類可編輯元素對應(yīng)唯一的性質(zhì)標(biāo)識，且每一個性質(zhì)標(biāo)識與一個編輯器一一對應(yīng)設(shè)置。
[0041]由前端技術(shù)人員制作需要設(shè)置為模板頁面的html文件，并在html文件基礎(chǔ)上為可編輯元素設(shè)置其性質(zhì)標(biāo)識，性質(zhì)標(biāo)識便于編輯器能識別相應(yīng)元素并調(diào)用相應(yīng)性質(zhì)的編輯器編輯此元素內(nèi)容，然后將此html文件內(nèi)容存入數(shù)據(jù)庫作為后續(xù)創(chuàng)建新頁面之原始內(nèi)容。
[0042]標(biāo)識可編輯元素性質(zhì)是為元素添加自定義屬性:tmode=”editingI [type]” ；
[0043]editing表示其是可被編輯元素，[type]標(biāo)識其是什么性質(zhì)的內(nèi)容，如:文本、圖片等。
[0044](二)所述系統(tǒng)還包括:編輯器存儲單元，用于存儲編輯可編輯元素中內(nèi)容所用到的編輯器。所述編輯器包括文本編輯器和圖形編輯器。
[0045]所述數(shù)據(jù)庫還存儲標(biāo)記過性質(zhì)標(biāo)識的HTML頁。
[0046](三)所述編輯子系統(tǒng)包括:判斷單元、分析查找單元、編輯單元和上傳單元；
[0047]判斷單元，負(fù)責(zé)監(jiān)聽JS鼠標(biāo)移動事件，并判斷鼠標(biāo)當(dāng)前所在元素是否為被標(biāo)記過性質(zhì)標(biāo)識的可編輯元素A，如果是，則將可編輯元素A及其信息發(fā)送給分析單元;如果否，則繼續(xù)判斷；
[0048]分析查找單元，分析并獲取所述可編輯元素A的性質(zhì)標(biāo)識，查找與所述性質(zhì)標(biāo)識對應(yīng)的編輯器；
[0049]編輯單元，加載所述編輯器，讀取所述可編輯元素A中記載的初始內(nèi)容，按照操作人員的指令對所述初始內(nèi)容進(jìn)行編輯，將編輯后的內(nèi)容更新到可編輯元素A中，并獲得當(dāng)前可編輯元素A中所有內(nèi)容所對應(yīng)的源碼；
[0050]上傳單元，將源碼上傳到服務(wù)器端并更新到數(shù)據(jù)庫中。
[0051 ] 實施例
[0052]本實施例是基于所述模板頁面編輯系統(tǒng)的模板頁面編輯方法，該方法包括:
[0053]SI，選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面添加到模板頁面記錄中，完成頁面的建立；
[0054]S2，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，當(dāng)鼠標(biāo)經(jīng)過html頁中被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，查找并獲得與所述可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器，加載所述編輯器，讀取并編輯所述可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼；
[0055]S3，從數(shù)據(jù)庫中獲得所述源碼，發(fā)布并生成.html文件。
[0056]本實施例中，在步驟SI之前還包括以下步驟:分析html頁，對html頁上的可編輯元素進(jìn)行性質(zhì)標(biāo)識，將標(biāo)識過的html頁存儲到數(shù)據(jù)庫中，從所述數(shù)據(jù)庫中選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面。
[0057]本實施例中，步驟S2，具體按照下述步驟實現(xiàn):
[0058]S21，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，判斷鼠標(biāo)當(dāng)前所在區(qū)域是否為被標(biāo)記過性質(zhì)標(biāo)識的可編輯元素A的內(nèi)容編輯區(qū)，如果是，則進(jìn)入S22;如果否，則返回S21;
[0059]S22，分析并獲取所述可編輯元素A的性質(zhì)標(biāo)識，查找與所述性質(zhì)標(biāo)識對應(yīng)的編輯器；
[0060]S23，加載所述編輯器，讀取所述可編輯元素A中記載的初始內(nèi)容，按照操作人員的指令對所述初始內(nèi)容進(jìn)行編輯，將編輯后的內(nèi)容更新到所述可編輯元素A的編輯區(qū)域，并獲得當(dāng)前可編輯元素A中所有內(nèi)容所對應(yīng)的源碼；
[0061 ] S24，將源碼上傳到服務(wù)器端并更新到數(shù)據(jù)庫中。
[0062]通過采用本發(fā)明公開的上述技術(shù)方案，得到了如下有益的效果:本發(fā)明所述系統(tǒng)過對模板內(nèi)容性質(zhì)識別的方案去定制通用編輯器，如文字編輯器和圖片編輯器，使定制的編輯器能夠被復(fù)用，能更快、更多的滿足各種類型的模板頁面；明顯減少模板頁面編輯系統(tǒng)編輯器的開發(fā)工作量，提高模板頁面開發(fā)人員的工作效率，減少溝通成本，模板頁面開發(fā)人員可根據(jù)所述系統(tǒng)提供的模版自行制作頁面。
[0063]以上所述僅是本發(fā)明的優(yōu)選實施方式，應(yīng)當(dāng)指出，對于本技術(shù)領(lǐng)域的普通技術(shù)人員來說，在不脫離本發(fā)明原理的前提下，還可以做出若干改進(jìn)和潤飾，這些改進(jìn)和潤飾也應(yīng)視本發(fā)明的保護(hù)范圍。
【主權(quán)項】
1.一種模板頁面編輯系統(tǒng)，其特征在于，該系統(tǒng)包括: 模板頁存儲分析單元，分析html頁，對html頁上的可編輯元素進(jìn)行性質(zhì)標(biāo)識后存儲； 頁面建立單元，從模板頁存儲分析單元選擇任意一個html頁作為初始頁面添加到新創(chuàng)建的模板頁面記錄中，完成頁面的建立； 編輯子系統(tǒng)，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，當(dāng)鼠標(biāo)經(jīng)過被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，查找并獲得與所述可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器，加載所述編輯器，讀取并編輯所述可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼，并上傳到服務(wù)器端并更新到數(shù)據(jù)庫中； 發(fā)布單元，從數(shù)據(jù)庫中獲得所述源碼，發(fā)布并生成.html文件。2.根據(jù)權(quán)利要求1所述模板頁面編輯系統(tǒng)，其特征在于，每類可編輯元素對應(yīng)唯一的性質(zhì)標(biāo)識，且每一個性質(zhì)標(biāo)識與一個編輯器 對應(yīng)設(shè)置。3.根據(jù)權(quán)利要求1所述模板頁面編輯系統(tǒng)，其特征在于，所述系統(tǒng)還包括:編輯器存儲單元，用于存儲編輯可編輯元素中內(nèi)容所用到的編輯器。4.根據(jù)權(quán)利要求1所述模板頁面編輯系統(tǒng)，其特征在于，所述編輯器包括文本編輯器和圖形編輯器。5.根據(jù)權(quán)利要求1所述模板頁面編輯系統(tǒng)，其特征在于，所述編輯子系統(tǒng)包括:判斷單元、分析查找單元、編輯單元和上傳單元； 判斷單元，負(fù)責(zé)監(jiān)聽JS鼠標(biāo)移動事件，并判斷鼠標(biāo)當(dāng)前所在區(qū)域是否為被標(biāo)記過性質(zhì)標(biāo)識的可編輯元素A的內(nèi)容編輯區(qū)，如果是，則將可編輯元素A及其信息發(fā)送給分析單元;如果否，則繼續(xù)判斷； 分析查找單元，分析并獲取所述可編輯元素A的性質(zhì)標(biāo)識，查找與所述性質(zhì)標(biāo)識對應(yīng)的編輯器； 編輯單元，加載所述編輯器，讀取所述可編輯元素A中記載的初始內(nèi)容，按照操作人員的指令對所述初始內(nèi)容進(jìn)行編輯，將編輯后的內(nèi)容更新到可編輯元素A中，并獲得當(dāng)前可編輯元素A中所有內(nèi)容所對應(yīng)的源碼； 上傳單元，將源碼上傳到服務(wù)器端并更新到數(shù)據(jù)庫中。6.根據(jù)權(quán)利要求1所述模板頁面編輯系統(tǒng)，其特征在于，所述數(shù)據(jù)庫還存儲標(biāo)記過性質(zhì)標(biāo)識的HTML頁。7.—種基于權(quán)利要求1至6任意一項所述模板頁面編輯系統(tǒng)的模板頁面編輯方法，其特征在于，該方法包括: SI，選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面添加到模板頁面記錄中，完成頁面的建立； S2，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，當(dāng)鼠標(biāo)經(jīng)過html頁中被標(biāo)記過性質(zhì)標(biāo)識的任意一個可編輯元素A時，查找并獲得與所述可編輯元素A的性質(zhì)標(biāo)識對應(yīng)的編輯器，加載所述編輯器，讀取并編輯所述可編輯元素A中記載的初始內(nèi)容，得到更新后的可編輯元素A中內(nèi)容所對應(yīng)的源碼； S3，從數(shù)據(jù)庫中獲得所述源碼，發(fā)布并生成.html文件。8.根據(jù)權(quán)利要求7所述模板頁面編輯方法，其特征在于，在步驟SI之前還包括以下步驟:分析html頁，對html頁上的可編輯元素進(jìn)行性質(zhì)標(biāo)識，將標(biāo)識過的html頁存儲到數(shù)據(jù)庫中，從所述數(shù)據(jù)庫中選擇已被性質(zhì)標(biāo)識過的html頁作為初始頁面。9.根據(jù)權(quán)利要求7所述模板頁面編輯方法，其特征在于，步驟S2，具體按照下述步驟實現(xiàn): S21，載入建立的頁面，并監(jiān)聽JS鼠標(biāo)移動事件，判斷鼠標(biāo)當(dāng)前所在區(qū)域是否為被標(biāo)記過性質(zhì)標(biāo)識的可編輯元素A的內(nèi)容編輯區(qū)，如果是，則進(jìn)入S22;如果否，則返回S21; S22，分析并獲取所述可編輯元素A的性質(zhì)標(biāo)識，查找與所述性質(zhì)標(biāo)識對應(yīng)的編輯器；S23，加載所述編輯器，讀取所述可編輯元素A中記載的初始內(nèi)容，按照操作人員的指令對所述初始內(nèi)容進(jìn)行編輯，將編輯后的內(nèi)容更新到可編輯元素A中，并獲得當(dāng)前可編輯元素A中所有內(nèi)容所對應(yīng)的源碼； S24，將源碼上傳到服務(wù)器端并更新到數(shù)據(jù)庫中。
【文檔編號】G06F17/30GK106066849SQ201610371425
【公開日】2016年11月2日
【申請日】2016年5月30日 公開號201610371425.2, CN 106066849 A, CN 106066849A, CN 201610371425, CN-A-106066849, CN106066849 A, CN106066849A, CN201610371425, CN201610371425.2
【發(fā)明人】林道輝
【申請人】車智互聯(lián)（北京）科技有限公司