本申請涉及網(wǎng)絡(luò)通信技術(shù)領(lǐng)域，特別涉及一種增強(qiáng)網(wǎng)頁元素屬性信息的方法及裝置。

背景技術(shù)：

超文本標(biāo)記語言(HyperText Markup Language，簡稱為HTML)是一種標(biāo)記語言。HTML被用來結(jié)構(gòu)化信息——例如標(biāo)題、段落和列表等等，也可用來在一定程度上描述文檔的外觀和語義。由蒂姆·伯納斯-李Tim Berners-Lee給出原始定義，由IETF用簡化的SGML(標(biāo)準(zhǔn)通用標(biāo)記語言)語法進(jìn)行進(jìn)一步發(fā)展的HTML，后來成為國際標(biāo)準(zhǔn)，由萬維網(wǎng)聯(lián)盟(W3C)維護(hù)。

在現(xiàn)有技術(shù)中，html語言通過type來指定元素的類型，如：

<button type＝“submit”>確定</button>

該描述表示了按鈕(button)的類型(type)為“submit”類型，在按鈕中顯示“確定”二字。

隨著網(wǎng)頁表達(dá)方式的多種多樣，網(wǎng)頁內(nèi)元素的類型有了更多的類型，甚至是自定義類型，但是在通常的html語言中type只有一個數(shù)據(jù)信息，無法精確的表達(dá)元素的類型，如果要表達(dá)元素更多的類型信息需要通過class屬性來更詳細(xì)的描述元素類型或者規(guī)格等內(nèi)容，并且type和class都包含有“類型”信息字段，在自定義元素時，不同的開發(fā)者可能會將類型標(biāo)識符寫在type或者class內(nèi)，造成代碼的可讀性和可維護(hù)性降低。

技術(shù)實(shí)現(xiàn)要素：

為了解決現(xiàn)有技術(shù)中網(wǎng)頁元素的屬性信息比較單一，擴(kuò)展屬性信息會造成網(wǎng)頁代碼可讀性和可維護(hù)性降低的問題，提出了一種增強(qiáng)網(wǎng)頁元素屬性信息的方法及裝置，可以提高可讀性和可維護(hù)性的前提下豐富網(wǎng)頁元素的屬性信息。

本申請實(shí)施例提供了一種增強(qiáng)網(wǎng)頁元素屬性信息的方法，包括，

獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息；

根據(jù)所述屬性增強(qiáng)信息得到相應(yīng)模板；

將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM文檔對象模型對象

根據(jù)本申請所述方法的一個進(jìn)一步的方面，獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息還具體包括，判斷所述網(wǎng)頁元素代碼中的屬性信息為原生信息或者增強(qiáng)信息，如果為原生信息則結(jié)束。

根據(jù)本申請所述方法的再一個進(jìn)一步的方面，在獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息中具體包括，根據(jù)所述元素屬性信息中的分隔符來分辨原生信息和增強(qiáng)信息。

根據(jù)本申請所述方法的另一個進(jìn)一步的方面，在根據(jù)所述屬性增強(qiáng)信息得到相應(yīng)模板中還具體包括，在網(wǎng)頁代碼中獲取元素模板路徑信息，根據(jù)所述屬性增強(qiáng)信息和所述元素模板路徑信息，得到與所述屬性增強(qiáng)信息相應(yīng)的模板。

根據(jù)本申請所述方法的另一個進(jìn)一步的方面，在網(wǎng)頁代碼中獲取元素模板路徑信息中還具體包括，在網(wǎng)頁代碼的全局變量中獲取元素模板路徑信息。

根據(jù)本申請所述方法的另一個進(jìn)一步的方面，所述元素模板路徑信息為網(wǎng)頁代碼所在服務(wù)器的模板文件路徑，或者為其它服務(wù)器的模板文件路徑。

根據(jù)本申請所述方法的另一個進(jìn)一步的方面，將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM對象還具體包括，

識別所述模板中的占位符；

獲取所述網(wǎng)頁元素代碼中與所述占位符相應(yīng)的屬性信息；

將所述屬性信息替換所述模板的占位符形成DOM對象。

根據(jù)本申請所述方法的另一個進(jìn)一步的方面，將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM對象還具體包括，將所述網(wǎng)頁元素代碼中非增強(qiáng)的屬性信息加入到所述DOM對象中。

本申請實(shí)施例還提供了一種增強(qiáng)網(wǎng)頁元素屬性信息的裝置，包括，

獲取單元，用于獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息；

匹配單元，用于根據(jù)所述屬性增強(qiáng)信息得到相應(yīng)模板；

處理單元，用于將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM對象。

根據(jù)本申請實(shí)施例所述裝置的一個進(jìn)一步的方面，所述獲取單元還用于判斷所述網(wǎng)頁元素代碼中的屬性信息為原生信息或者增強(qiáng)信息，如果為原生信息則結(jié)束。

根據(jù)本申請實(shí)施例所述裝置的再一個進(jìn)一步的方面，所述獲取單元根據(jù)所述元素屬性信息中的分隔符來分辨原生信息和增強(qiáng)信息。

根據(jù)本申請實(shí)施例所述裝置的另一個進(jìn)一步的方面，所述匹配單元在網(wǎng)頁代碼中獲取元素模板路徑信息，根據(jù)所述屬性增強(qiáng)信息和所述元素模板路徑信息，得到與所述屬性增強(qiáng)信息相應(yīng)的模板。

根據(jù)本申請實(shí)施例所述裝置的另一個進(jìn)一步的方面，所述匹配單元在網(wǎng)頁代碼的全局變量中獲取元素模板路徑信息。

根據(jù)本申請實(shí)施例所述裝置的另一個進(jìn)一步的方面，所述路徑信息為網(wǎng)頁代碼所在服務(wù) 器的模板文件路徑，或者為其它服務(wù)器的模板文件路徑。

根據(jù)本申請實(shí)施例所述裝置的另一個進(jìn)一步的方面，所述處理單元還用于：

識別所述模板中的占位符；

獲取所述網(wǎng)頁元素代碼中與所述占位符相應(yīng)的屬性信息；

將所述屬性信息替換所述模板的占位符形成DOM對象。

根據(jù)本申請實(shí)施例所述裝置的另一個進(jìn)一步的方面，所述處理單元還用于：將所述網(wǎng)頁元素代碼中非增強(qiáng)的屬性信息加入到所述DOM對象中。

由以上本申請實(shí)施例提供的技術(shù)方案可見，以通過在網(wǎng)頁代碼中加入更多的增強(qiáng)信息來精確描述網(wǎng)頁元素的屬性，不同的屬性增強(qiáng)信息對應(yīng)著不同的模板，通過對所述模板進(jìn)行多樣性的配置，從而可以實(shí)現(xiàn)增強(qiáng)網(wǎng)頁元素的目的，并且簡化了網(wǎng)頁代碼，使得網(wǎng)頁代碼在可讀性和可維護(hù)性上都有了很大的提升。

當(dāng)然實(shí)施本申請的任一產(chǎn)品或者方法必不一定需要同時達(dá)到以上所述的所有優(yōu)點(diǎn)。

附圖說明

為了更清楚地說明本申請實(shí)施例或現(xiàn)有技術(shù)中的技術(shù)方案，下面將對實(shí)施例或現(xiàn)有技術(shù)描述中所需要使用的附圖作簡單地介紹，顯而易見地，下面描述中的附圖僅僅是本申請中記載的一些實(shí)施例，對于本領(lǐng)域普通技術(shù)人員來講，在不付出創(chuàng)造性勞動性的前提下，還可以根據(jù)這些附圖獲得其他的附圖。

圖1所示為本申請實(shí)施例一種增強(qiáng)網(wǎng)頁元素屬性信息的方法流程圖；

圖2所示為本申請實(shí)施例一種增強(qiáng)網(wǎng)頁元素屬性信息的裝置結(jié)構(gòu)示意圖；

圖3所示為本申請實(shí)施例一種增強(qiáng)網(wǎng)頁元素類型的方法流程圖；

圖4所示為本申請實(shí)施例在網(wǎng)絡(luò)服務(wù)器中存儲的模板地址形式圖；

圖5所示為本申請實(shí)施例另一種增強(qiáng)網(wǎng)頁元素類型的方法流程圖。

具體實(shí)施方式

本申請實(shí)施例提供一種增強(qiáng)網(wǎng)頁元素屬性信息的方法及裝置。

為了使本技術(shù)領(lǐng)域的人員更好地理解本申請中的技術(shù)方案，下面將結(jié)合本申請實(shí)施例中的附圖，對本申請實(shí)施例中的技術(shù)方案進(jìn)行清楚、完整地描述，顯然，所描述的實(shí)施例僅僅是本申請一部分實(shí)施例，而不是全部的實(shí)施例?；诒旧暾堉械膶?shí)施例，本領(lǐng)域普通技術(shù)人員在沒有作出創(chuàng)造性勞動前提下所獲得的所有其他實(shí)施例，都應(yīng)當(dāng)屬于本申請保護(hù)的范圍。

如圖1所示為本申請實(shí)施例一種增強(qiáng)網(wǎng)頁元素屬性信息的方法流程圖。在該圖中描述了 本申請技術(shù)方案如何實(shí)現(xiàn)增強(qiáng)網(wǎng)頁元素類型的方法，通過在服務(wù)器的網(wǎng)頁html代碼中元素的屬性中寫入增強(qiáng)信息(能夠代表更豐富信息的標(biāo)識符或者字符串)，例如在類型(type)屬性或自定義屬性中寫入增強(qiáng)信息，在客戶端瀏覽器解析該網(wǎng)頁html前，將屬性的增強(qiáng)信息通過模板的方式進(jìn)行還原，從而可以獲得格式上統(tǒng)一，方便閱讀和方便維護(hù)的具有豐富屬性信息的網(wǎng)頁代碼。其中，類型屬性包括但不限于元素的顏色、尺寸、外觀形狀、位置等等內(nèi)容。

該圖1中包括步驟101，獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息。

步驟102，根據(jù)所述屬性增強(qiáng)信息得到相應(yīng)模板。

步驟103，將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM(文檔對象模型)對象。

然后客戶端瀏覽器可以解析DOM對象從而在客戶端的瀏覽器中呈現(xiàn)具有屬性增強(qiáng)信息的頁面。在本申請的技術(shù)方案中所述的元素屬性可以包括比較廣泛的內(nèi)容，既包括瀏覽器原生支持的屬性，例如type(類型屬性)等屬性，也可以包括自定義的屬性(瀏覽器原生不支持的屬性)，例如msg(消息屬性)等。

作為本申請的一個實(shí)施例，獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息還具體包括，判斷所述網(wǎng)頁元素代碼中的屬性信息為原生信息或者增強(qiáng)信息，如果為原生信息則結(jié)束本申請的方法。結(jié)束本申請方法的含義為不進(jìn)行本申請的屬性的增強(qiáng)信息進(jìn)行處理，將該元素的屬性信息留給后繼現(xiàn)有技術(shù)中的瀏覽器進(jìn)行解析。

作為本申請的一個實(shí)施例，在獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息中具體包括，根據(jù)所述元素屬性信息中的分隔符來分辨原生信息和增強(qiáng)信息。其中，可以通過“/”或者“.”等分隔符將類型的原生信息和增強(qiáng)信息進(jìn)行區(qū)分，例如button type＝”button/success”，是指元素按鈕(button)類型(type)中包括原生信息(button)和增強(qiáng)信息(success)，作為一個進(jìn)一步的實(shí)施例，增強(qiáng)信息可以分為多級或者多個，以指明該按鈕的具體類型，例如button type＝”button/success/1”，是指在元素button的類型為button下success下1這個屬性?；蛘?，該屬性為自定義屬性，該屬性信息即為增強(qiáng)信息，由于用戶端瀏覽器不能解析自定義屬性，因此該自定義屬性中的信息均為增強(qiáng)信息，例如button tpl＝”abcd”，表示自定義屬性tpl的屬性信息為abcd，該abcd為增強(qiáng)信息。

作為本申請的一個實(shí)施例，在根據(jù)所述屬性增強(qiáng)信息得到相應(yīng)模板中還具體包括，在網(wǎng)頁代碼中獲取元素模板路徑信息，根據(jù)所述屬性增強(qiáng)信息和所述元素模板路徑信息，得到與所述屬性增強(qiáng)信息相應(yīng)的模板。

作為本申請的一個實(shí)施例，在網(wǎng)頁代碼中獲取元素模板路徑信息中還具體包括，在網(wǎng)頁代碼的全局變量中獲取元素模板路徑信息。其中，所述從網(wǎng)頁代碼中獲取元素模板路徑是指， 在網(wǎng)頁代碼的全局變量中事先寫入模板的路徑信息，或者在元素類型的增強(qiáng)信息中直接寫入該模板的路徑信息，例如<button type＝http://abc.com/button/big.tpl>hello</button>。

作為本申請的一個實(shí)施例，所述元素模板路徑信息可以為網(wǎng)頁代碼所在服務(wù)器的模板文件路徑(本地模板)，也可以為其它配置服務(wù)器的模板文件路徑(遠(yuǎn)程模板)，通過遠(yuǎn)程模板和本地模板的配置，可以使得元素類型的增強(qiáng)信息更加豐富和靈活。

作為本申請的一個實(shí)施例，將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM對象還具體包括，

識別所述模板中的占位符；

獲取所述網(wǎng)頁元素代碼中與所述占位符相應(yīng)的屬性信息；

將所述屬性信息替換所述模板的占位符形成DOM對象。

作為本申請的一個實(shí)施例，將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM對象還包括，將所述網(wǎng)頁元素代碼中非增強(qiáng)的屬性信息加入到所述DOM對象中。

例如，網(wǎng)頁元素的代碼為<button type＝”button/success”click＝”alert(1)”id＝”button1”title＝”ok”>你好</button>這里面id、click、title都屬于非增強(qiáng)屬性信息，模板為<button type＝”{{button.type}}”class＝”btn btn-primary”>{{button.text}}</button>，占位符信息：button＝{”button.type”:”button”,”button.text”:”你好”}，使用屬性信息“button”和“你好”替換模板的占位符形成DOM對象，并且將非增強(qiáng)的屬性信息click＝”alert(1)”、id＝”button1”和title＝”ok”加入到DOM對象中后，最終的DOM對象為<button type＝”button”class＝”btn btn-primary”id＝”button1”click＝”alert(1)”title＝”ok”>你好</button>。如果網(wǎng)頁元素的代碼中沒有非增強(qiáng)的屬性信息，則可以屬性信息替換模板占位符后即形成DOM對象。

通過上述本申請實(shí)施例中的方法，可以通過在網(wǎng)頁代碼中加入更多的增強(qiáng)信息來精確描述網(wǎng)頁元素的屬性，不同的屬性增強(qiáng)信息對應(yīng)著不同的模板，通過對所述模板進(jìn)行多樣性的配置，從而可以實(shí)現(xiàn)增強(qiáng)網(wǎng)頁元素的目的，并且簡化了網(wǎng)頁代碼，使得網(wǎng)頁代碼在可讀性和可維護(hù)性上都有了很大的提升，本申請的方法可以很好地運(yùn)行于angularjs這類數(shù)據(jù)和模板分離的JS框架之上，或者也可以運(yùn)行于其它類似框架之上。

如圖2所示為本申請實(shí)施例一種增強(qiáng)網(wǎng)頁元素屬性信息的裝置結(jié)構(gòu)示意圖，其中，該裝置可以為軟件或者由邏輯電路實(shí)現(xiàn)的邏輯，例如為JavaScript腳本或者為VBscript腳本等，在用戶端計算機(jī)或者智能終端的瀏覽器解析網(wǎng)頁代碼之前運(yùn)行本申請的裝置，對網(wǎng)頁代碼中元素屬性的增強(qiáng)信息進(jìn)行解析和處理，使得用戶終端的瀏覽器可以解析含有增強(qiáng)元素屬性的網(wǎng)頁，通過本申請的裝置還可以使得開發(fā)者在編輯網(wǎng)頁代碼時更加簡潔和規(guī)范，增加了元素 屬性的精確度，提高了代碼的可讀性和可維護(hù)性。

該裝置包括獲取單元201，用于獲取網(wǎng)頁元素代碼中的屬性增強(qiáng)信息。

匹配單元202，用于根據(jù)所述屬性增強(qiáng)信息得到相應(yīng)模板。

處理單元203，用于將所述網(wǎng)頁元素代碼中的信息結(jié)合所述模板形成DOM對象。

然后客戶端瀏覽器可以解析DOM對象從而在客戶端的瀏覽器中呈現(xiàn)具有屬性增強(qiáng)信息的頁面。

作為本申請的一個實(shí)施例，所述獲取單元還用于判斷所述網(wǎng)頁元素代碼中的屬性信息為原生信息或者增強(qiáng)信息，如果為原生信息則結(jié)束。

作為本申請的一個實(shí)施例，所述獲取單元根據(jù)所述元素屬性信息中的分隔符來分辨原生信息和增強(qiáng)信息。

作為本申請的一個實(shí)施例，所述匹配單元在網(wǎng)頁代碼中獲取元素模板路徑信息，根據(jù)所述屬性增強(qiáng)信息和所述元素模板路徑信息，得到與所述屬性增強(qiáng)信息相應(yīng)的模板。

作為本申請的一個實(shí)施例，所述匹配單元在網(wǎng)頁代碼的全局變量中獲取元素模板路徑信息。

作為本申請的一個實(shí)施例，所述路徑信息可以為網(wǎng)頁代碼所在服務(wù)器的模板文件路徑(本地模板)，也可以為其它配置服務(wù)器的模板文件路徑(遠(yuǎn)程模板)，通過遠(yuǎn)程模板和本地模板的配置，可以使得元素屬性的增強(qiáng)信息更加豐富和靈活。

作為本申請的一個實(shí)施例，所述處理單元還用于：

識別所述模板中的占位符；

獲取所述網(wǎng)頁元素代碼中與所述占位符相應(yīng)的屬性信息；

將所述屬性信息替換所述模板的占位符形成DOM對象。

作為本申請的一個實(shí)施例，所述處理單元還用于：將所述網(wǎng)頁元素代碼中非增強(qiáng)的屬性信息加入到所述DOM對象中。

通過上述本申請實(shí)施例中的裝置，可以通過在網(wǎng)頁代碼中加入更多的增強(qiáng)信息來精確描述網(wǎng)頁元素的屬性，不同的屬性增強(qiáng)信息對應(yīng)著不同的模板，通過對所述模板進(jìn)行多樣性的配置，從而可以實(shí)現(xiàn)增強(qiáng)網(wǎng)頁元素的目的，并且簡化了網(wǎng)頁代碼，使得網(wǎng)頁代碼在可讀性和可維護(hù)性上都有了很大的提升。

如圖3所示為本申請實(shí)施例一種增強(qiáng)網(wǎng)頁元素類型的方法流程圖，在該圖中以網(wǎng)頁元素中的類型(type)屬性為例，對增強(qiáng)網(wǎng)頁元素屬性信息的方法進(jìn)行描述，從而實(shí)現(xiàn)對網(wǎng)頁元素的屬性進(jìn)行增強(qiáng)擴(kuò)展，并且提高代碼可讀性和可維護(hù)性的目的。作為本領(lǐng)域技術(shù)人員可以理解的是，元素的類型(type)只是本申請方法的一個特例，還可以應(yīng)用于其他元素屬性， 例如class或其他屬性。

對于type屬性來說，可以多種type的描述方式，例如：

<button type＝”button/primary”>確定</button>，它表示的是button下的primary類型。

<button type＝”submit/primary”>提交</button>，它表達(dá)的是submit(提交)按鈕下的primary類型。

<msg type＝”notice/success”></msg>，它表達(dá)的是notice(提示)信息(msg)下的success類型。

<msg type＝”alert/success”></msg>，它表達(dá)的是alert(報警)信息(msg)下的success類型。

下面以網(wǎng)頁元素代碼<button type＝”button/primary”click＝”click()”>OK</button>，其相應(yīng)的模板為<button type＝”{{button.type}}”class＝”btn btn-primary”>{{button.text}}</button>為例，對本申請的方法進(jìn)行詳細(xì)描述。

該圖包括步驟301，用戶終端接收到網(wǎng)頁代碼，在瀏覽器解析所述網(wǎng)頁代碼之前，調(diào)用Java Script腳本(JS)對網(wǎng)頁代碼進(jìn)行解析。

步驟302，判斷上述網(wǎng)頁元素類型的代碼中是否包括屬性增強(qiáng)信息，如果類型中的屬性信息為原生信息則進(jìn)入步驟303，否則進(jìn)入步驟304。

其中，如上述網(wǎng)頁元素代碼所示，在type類型的屬性信息中包括了”button/primary”，該信息不是常規(guī)的原生信息(原生信息可能只包括“button”信息以指明該類型為按鈕類型)，而是包括了primary的增強(qiáng)信息，所以該類型的屬性信息中包括了增強(qiáng)信息。

進(jìn)一步的，通過識別屬性信息中的分隔符，在本例中為“/”，來識別屬性信息中哪些為原生信息，哪些為增強(qiáng)信息，在本例中為一個分隔符，在分隔符之后的信息為增強(qiáng)信息，當(dāng)然，作為另一個實(shí)施例，還可以有更多的分隔符將屬性信息分為多級，例如”button/primary/abc”。

進(jìn)一步的，還可以通過識別屬性信息是否與原生信息相一致，如果不是原生信息則認(rèn)為該屬性信息為增強(qiáng)信息，在這個步驟中，屬性信息省去了分隔符，只需要根據(jù)屬性信息的字符串進(jìn)行判斷就可以得到原生信息或者增強(qiáng)信息。

步驟303，結(jié)束本申請的方法，回到現(xiàn)有技術(shù)中的流程，即由瀏覽器對網(wǎng)頁代碼進(jìn)行解析和渲染呈現(xiàn)。

步驟304，在網(wǎng)頁代碼中獲取元素模板路徑信息。

在本步驟中，可以從網(wǎng)頁代碼的全局變量中獲取元素模板路徑信息，該元素模板的路徑 信息包括模板路徑和模板文件夾名稱，例如在本例中，模板路徑為panda.tplBase＝”../tpl/”，模板文件夾名稱為panda.theme＝“bootstrap”，其中，模板路徑可以為傳送該網(wǎng)頁代碼的網(wǎng)絡(luò)服務(wù)器地址，也可以為其它網(wǎng)絡(luò)服務(wù)器地址，在本例中的”../tpl/”指的是傳送該網(wǎng)頁代碼的網(wǎng)絡(luò)服務(wù)器的本地模板，還可以為遠(yuǎn)端模板例如panda.tplBase＝http://XXXXX/tpl/。

步驟305，將上述元素模板路徑信息和增強(qiáng)屬性信息結(jié)合，構(gòu)成具體的模板地址。

如圖4所示為本申請實(shí)施例在網(wǎng)絡(luò)服務(wù)器中存儲的模板地址形式，其中tpl為模板文件夾路徑，bootstrap為模板的文件夾名稱，button.primary.tpl為模板的名稱，生成的模板地址為”../tpl/bootstrap/button.primary.tpl”。

步驟306，根據(jù)上述模板地址從相應(yīng)的網(wǎng)絡(luò)服務(wù)器獲取增強(qiáng)屬性信息對應(yīng)的模板。

用戶終端根據(jù)上述模板地址通過互聯(lián)網(wǎng)從網(wǎng)絡(luò)服務(wù)器中獲取模板，在本例中，屬性增強(qiáng)信息為”button/primary”，JS在得到button/primary時，將”/”替換為“.”，變?yōu)閎utton.primary，然后加上”.tpl”的后綴，就生成了button.primary.tpl，如果對應(yīng)的位置有這個模板，就被加載，否則就會出現(xiàn)文件找不到的錯誤，該模板為<button type＝”{{button.type}}”class＝”btn btn-primary”>{{button.text}}</button>。

步驟307，識別所述模板中的占位符。

在本步驟中，以“{{”和“}}”作為占位符，在其它的實(shí)施例中可以采用其它的符號或者字符串等形式作為占位符。

步驟308，獲取所述網(wǎng)頁元素代碼中與所述占位符相應(yīng)的屬性信息。

在本實(shí)施例中，網(wǎng)頁元素代碼中與占位符相應(yīng)的屬性信息為，button＝{“type”:”button”,”text”:”O(jiān)K”}。

步驟309，將上述屬性信息替換所述模板中的占位符形成DOM對象。

處理后得到更新的模板，<button type＝”button”class＝”btn btn-primary”>OK</button>。

步驟310，將網(wǎng)頁元素代碼中非type的屬性加入到DOM對象中，形成最終的DOM對象。

在本步驟中，網(wǎng)頁元素代碼中除了type屬性之外，還有click屬性，將該屬性加入到DOM對象中，最后形成的DOM對象為<button type＝”button”class＝”btn btn-primary”click＝”click()”>OK</button>。

如果網(wǎng)頁元素代碼中沒有非type的屬性時，本步驟在處理過程中不實(shí)施，也就是說本步驟是可選的步驟。

步驟311，瀏覽器解析網(wǎng)頁元素的DOM對象，在顯示器中呈現(xiàn)網(wǎng)頁內(nèi)容。

此時，在JS處理后的網(wǎng)頁代碼可以為用戶終端的瀏覽器所解析，可以使得元素button具有更精確的type屬性，并且可以在網(wǎng)頁代碼中省略class等內(nèi)容。本申請的方法可以適用于瀏覽器支持的元素(原生的網(wǎng)頁元素)，也可以適用于瀏覽器不支持的元素(自定義元素)，對于自定義元素的解析不屬于本申請要解決的技術(shù)問題，因此不在此處進(jìn)行描述，對任意元素中增強(qiáng)的屬性均可以使用本申請的技術(shù)方案進(jìn)行解析和呈現(xiàn)。

如圖5所示為本申請實(shí)施例另一種增強(qiáng)網(wǎng)頁元素類型的方法流程圖，其中本申請的方法可以適用于其它元素的屬性例如，1、<msg category＝”notice/success”></msg>；2、<msg category＝”success”></msg>；自定義屬性：1、<msg type＝”notice/success”></msg>；2、<msg type＝”alert/success”></msg>，其中msg是自定義元素，category、type均為屬性，””中均為屬性信息，在本實(shí)施例中，還是以網(wǎng)頁元素中的類型(type)為例，對增強(qiáng)網(wǎng)頁元素屬性信息的方法進(jìn)行描述，與上述實(shí)施例不同的是，在本例中模板路徑信息不在全局變量中，而是在type的屬性信息中，并且屬性信息中沒有原生信息，包括的屬性信息為增強(qiáng)信息。

下面以網(wǎng)頁元素代碼<button type＝”/tpl/bootstrap/button/primary”>ok</button>，其相應(yīng)的模板為<button type＝”button”class＝”btn btn-primary”>{{button.text}}</button>為例，對本申請的方法進(jìn)行詳細(xì)描述。

在本實(shí)施例中包括步驟501，用戶終端接收到網(wǎng)頁代碼，在瀏覽器解析所述網(wǎng)頁代碼之前，調(diào)用Java Script腳本(JS)或者VB Script腳本對網(wǎng)頁代碼進(jìn)行解析。

步驟502，判斷上述網(wǎng)頁元素類型的代碼中是否包括屬性增強(qiáng)信息，如果類型中的屬性信息為原生信息則進(jìn)入步驟503，否則進(jìn)入步驟504。

將網(wǎng)頁元素類型的屬性信息代碼與原生信息比較，如果屬于原生信息，則進(jìn)入步驟503，否則進(jìn)入步驟504，在本例中type＝”/tpl/bootstrap/button/primary”不屬于原生信息，直接進(jìn)入步驟504。

步驟503，結(jié)束本申請的方法，回到現(xiàn)有技術(shù)中的流程，即由瀏覽器對網(wǎng)頁代碼進(jìn)行解析和渲染呈現(xiàn)。

步驟504，在所述網(wǎng)頁元素類型的代碼的屬性增強(qiáng)信息中獲取元素模板路徑信息。

在屬性增強(qiáng)信息中包括元素模板路徑信息“/tpl/bootstrap/”，“button/primary”為模板名稱，此時的“/”不是分隔符，僅僅是代表模板文件路徑的符號。

步驟505，將上述元素模板路徑信息和增強(qiáng)屬性信息結(jié)合，構(gòu)成具體的模板地址。

在本例中生成的模板地址為”/tpl/bootstrap/button.primary.tpl”。

步驟506，根據(jù)上述模板地址從相應(yīng)的網(wǎng)絡(luò)服務(wù)器獲取增強(qiáng)屬性信息對應(yīng)的模板。

獲取的模板為<button type＝”button”class＝”btn btn-primary”>{{button.text}}</button>。

步驟507，識別所述模板中的占位符。

步驟508，獲取所述網(wǎng)頁元素代碼中與所述占位符相應(yīng)的屬性信息。

在本實(shí)施例中，網(wǎng)頁元素代碼中與占位符相應(yīng)的屬性信息為，button＝{”text”:”O(jiān)K”}。

步驟509，將上述屬性信息替換所述模板中的占位符形成DOM對象。

處理后得到DOM對象，<button type＝”button”class＝”btn btn-primary”>OK</button>。

步驟510，瀏覽器解析網(wǎng)頁元素的DOM對象，在顯示器中呈現(xiàn)網(wǎng)頁內(nèi)容。

通過上述本申請實(shí)施例中的方法和裝置，可以通過在網(wǎng)頁代碼中加入更多的增強(qiáng)信息來精確描述網(wǎng)頁元素的屬性，不同的屬性增強(qiáng)信息對應(yīng)著不同的模板，通過對所述模板進(jìn)行多樣性的配置，從而可以實(shí)現(xiàn)增強(qiáng)網(wǎng)頁元素的目的，并且簡化了網(wǎng)頁代碼，使得網(wǎng)頁代碼在可讀性和可維護(hù)性上都有了很大的提升。

對于一個技術(shù)的改進(jìn)可以很明顯地區(qū)分是硬件上的改進(jìn)(例如，對二極管、晶體管、開關(guān)等電路結(jié)構(gòu)的改進(jìn))還是軟件上的改進(jìn)(對于方法流程的改進(jìn))。然而，隨著技術(shù)的發(fā)展，當(dāng)今的很多方法流程的改進(jìn)已經(jīng)可以視為硬件電路結(jié)構(gòu)的直接改進(jìn)。設(shè)計人員幾乎都通過將改進(jìn)的方法流程編程到硬件電路中來得到相應(yīng)的硬件電路結(jié)構(gòu)。因此，不能說一個方法流程的改進(jìn)就不能用硬件實(shí)體模塊來實(shí)現(xiàn)。例如，可編程邏輯器件(Programmable Logic Device,PLD)(例如現(xiàn)場可編程門陣列(Field Programmable Gate Array，F(xiàn)PGA))就是這樣一種集成電路，其邏輯功能由用戶對器件編程來確定。由設(shè)計人員自行編程來把一個數(shù)字系統(tǒng)“集成”在一片PLD上，而不需要請芯片制造廠商來設(shè)計和制作專用的集成電路芯片2。而且，如今，取代手工地制作集成電路芯片，這種編程也多半改用“邏輯編譯器(logic compiler)”軟件來實(shí)現(xiàn)，它與程序開發(fā)撰寫時所用的軟件編譯器相類似，而要編譯之前的原始代碼也得用特定的編程語言來撰寫，此稱之為硬件描述語言(Hardware Description Language，HDL)，而HDL也并非僅有一種，而是有許多種，如ABEL(Advanced Boolean Expression Language)、AHDL(Altera Hardware Description Language)、Confluence、CUPL(Cornell University Programming Language)、HDCal、JHDL(Java Hardware Description Language)、Lava、Lola、MyHDL、PALASM、RHDL(Ruby Hardware Description Language)等，目前最普遍使用的是VHDL(Very-High-Speed Integrated Circuit Hardware Description Language)與Verilog2。本領(lǐng)域技術(shù)人員也應(yīng)該清楚，只需要將方法流程用上述幾種硬件描述語言稍作邏輯編程并編程到集成電路中，就可以很容易得到實(shí)現(xiàn)該邏輯方法流程的硬件電路。

控制器可以按任何適當(dāng)?shù)姆绞綄?shí)現(xiàn)，例如，控制器可以采取例如微處理器或處理器以及存儲可由該(微)處理器執(zhí)行的計算機(jī)可讀程序代碼(例如軟件或固件)的計算機(jī)可讀介質(zhì)、邏輯門、開關(guān)、專用集成電路(Application Specific Integrated Circuit，ASIC)、可編程邏輯控制器和嵌入微控制器的形式，控制器的例子包括但不限于以下微控制器：ARC625D、Atmel AT91SAM、Microchip PIC18F26K20以及Silicone Labs C8051F320，存儲器控制器還可以被實(shí)現(xiàn)為存儲器的控制邏輯的一部分。

本領(lǐng)域技術(shù)人員也知道，除了以純計算機(jī)可讀程序代碼方式實(shí)現(xiàn)控制器以外，完全可以通過將方法步驟進(jìn)行邏輯編程來使得控制器以邏輯門、開關(guān)、專用集成電路、可編程邏輯控制器和嵌入微控制器等的形式來實(shí)現(xiàn)相同功能。因此這種控制器可以被認(rèn)為是一種硬件部件，而對其內(nèi)包括的用于實(shí)現(xiàn)各種功能的裝置也可以視為硬件部件內(nèi)的結(jié)構(gòu)。或者甚至，可以將用于實(shí)現(xiàn)各種功能的裝置視為既可以是實(shí)現(xiàn)方法的軟件模塊又可以是硬件部件內(nèi)的結(jié)構(gòu)。

上述實(shí)施例闡明的系統(tǒng)、裝置、模塊或單元，具體可以由計算機(jī)芯片或?qū)嶓w實(shí)現(xiàn)，或者由具有某種功能的產(chǎn)品來實(shí)現(xiàn)。

為了描述的方便，描述以上裝置時以功能分為各種單元分別描述。當(dāng)然，在實(shí)施本申請時可以把各單元的功能在同一個或多個軟件和/或硬件中實(shí)現(xiàn)。

通過以上的實(shí)施方式的描述可知，本領(lǐng)域的技術(shù)人員可以清楚地了解到本申請可借助軟件加必需的通用硬件平臺的方式來實(shí)現(xiàn)?；谶@樣的理解，本申請的技術(shù)方案本質(zhì)上或者說對現(xiàn)有技術(shù)做出貢獻(xiàn)的部分可以以軟件產(chǎn)品的形式體現(xiàn)出來，該計算機(jī)軟件產(chǎn)品可以存儲在存儲介質(zhì)中，如ROM/RAM、磁碟、光盤等，包括若干指令用以使得一臺計算機(jī)設(shè)備(可以是個人計算機(jī)，服務(wù)器，或者網(wǎng)絡(luò)設(shè)備等)執(zhí)行本申請各個實(shí)施例或者實(shí)施例的某些部分所述的方法。

本說明書中的各個實(shí)施例均采用遞進(jìn)的方式描述，各個實(shí)施例之間相同相似的部分互相參見即可，每個實(shí)施例重點(diǎn)說明的都是與其他實(shí)施例的不同之處。尤其，對于系統(tǒng)實(shí)施例而言，由于其基本相似于方法實(shí)施例，所以描述的比較簡單，相關(guān)之處參見方法實(shí)施例的部分說明即可。

本申請可用于眾多通用或?qū)Ｓ玫挠嬎銠C(jī)系統(tǒng)環(huán)境或配置中。例如：個人計算機(jī)、服務(wù)器計算機(jī)、手持設(shè)備或便攜式設(shè)備、平板型設(shè)備、多處理器系統(tǒng)、基于微處理器的系統(tǒng)、置頂盒、可編程的消費(fèi)電子設(shè)備、網(wǎng)絡(luò)PC、小型計算機(jī)、大型計算機(jī)、包括以上任何系統(tǒng)或設(shè)備的分布式計算環(huán)境等等。

本申請可以在由計算機(jī)執(zhí)行的計算機(jī)可執(zhí)行指令的一般上下文中描述，例如程序模塊。 一般地，程序模塊包括執(zhí)行特定任務(wù)或?qū)崿F(xiàn)特定抽象數(shù)據(jù)類型的例程、程序、對象、組件、數(shù)據(jù)結(jié)構(gòu)等等。也可以在分布式計算環(huán)境中實(shí)踐本申請，在這些分布式計算環(huán)境中，由通過通信網(wǎng)絡(luò)而被連接的遠(yuǎn)程處理設(shè)備來執(zhí)行任務(wù)。在分布式計算環(huán)境中，程序模塊可以位于包括存儲設(shè)備在內(nèi)的本地和遠(yuǎn)程計算機(jī)存儲介質(zhì)中。

雖然通過實(shí)施例描繪了本申請，本領(lǐng)域普通技術(shù)人員知道，本申請有許多變形和變化而不脫離本申請的精神，希望所附的權(quán)利要求包括這些變形和變化而不脫離本申請的精神。