一种基于网页内元素异同的页面自动更新方法与流程

本发明涉及计算机界面设计技术领域，尤其涉及一种基于网页内元素异同的页面自动更新方法。

背景技术：

目前用户引用某个由设计人员提供的模板进行页面设计，经过一段时间后，设计人员提供的这个模板很可能做过修改，进行过模板设计，而用户引用这个模板生成的页面也需要同步升级，并且页面升级的内容要和模板升级的内容一致，在没有页面元素自动替换的情况下，如果模板有升级，页面也需要跟随升级的话，只能用户自己去对照模板手动调整页面，工作量大且效果不明显。

技术实现要素：

鉴于上述的分析，本发明旨在提供一种基于网页内元素异同的页面自动更新方法，以解决目前页面设计中由于模板升级使得页面随着升级时采用手动调整页面带来工作量大的问题，实现了页面的自动化升级。

本发明的目的主要是通过以下技术方案实现的：

本发明提供了一种基于网页内元素异同的页面自动更新方法，包括以下步骤：

标记a模板中m页面的修改并保存，发布修改后的所述a模板；

所述a模板发布后，更新a模板的版本号及修改后的m页面的版本号得到m页面的实际版本号；

比较m页面的所述实际版本号与记录版本号后显示所述a模板的更新标志；所述记录版本号为引用所述a模板中m页面的n页面所记录的版本号；

根据系统显示的所述a模板的更新标志，确定是否启动页面升级；以及，

当确定启动页面升级后，按照a模板更新后的m页面的元素异同更新所述n页面。

进一步地，所述标记a模板中m页面的修改，包括：将a模板和m页面标记为可变更；并根据所述可变更的标记，将a模板的发布按钮设置为可点击状态；

所述发布修改后的所述a模板，包括：接收对可点击状态的所述a模板的发布按钮的点击操作，发布所述a模板。

进一步地，所述a模板发布后，更新a模板的版本号及修改后的m页面的版本号得到m页面的实际版本号，包括：所述a模板的版本号和所述m页面的版本号均加1得到实际版本号。

进一步地，所述比较所述实际版本号与记录版本号后显示所述a模板的更新标志包括：所述实际版本号大于所述记录版本号，系统标记n页面可升级，所述n页面显示待升级标志。

进一步地，所述确定是否启动页面升级，包括：接收到用户点击所述n页面显示的待升级标志后触发页面升级功能，系统提示用户是否按照更新后的a模板m页面升级n页面，并展示升级n页面样式；若选择是，则确定启动页面升级。

进一步地，所述升级n页面样式包括：n页面中所包括的m页面的区域升级成对应m页面的区域的样式，n页面中非m页面的区域或者n页面中已删除的m页面区域不变动。

进一步地，当确定启动页面升级后，按照a模板更新后的m页面的元素异同更新所述n页面，包括对m页面区域和组件元素的标签id和n页面区域和组件元素的标签id进行对比：

若标签id一致，则判断n页面的该区域组件元素为m页面的区域组件元素后，进行升级处理；

若n页面中存在，而m页面中不存在的标签id，则该区域组件元素为n页面中新增或m页面中被删除的区域组件元素，不进行升级处理；

若n页面中不存在，而m页面中存在的标签id，则该区域组件元素在n页面中被删除或该区域的组件元素为m页面中新增的区域组件元素，不进行升级处理。

进一步地，所述a模板包括多个页面，所述m页面是a模板中的一个页面；所述n页面为b项目的一个页面，所述b项目包括多个页面。

进一步地，一种基于上述方法的操作界面，包括：通用门户模板，登录页面，保存按钮和发布按钮；

所述通用门户模板的登录页面修改后，点击所述保存按钮标记所述通用门户模板和所述登录页面的变动；

所述发布按钮根据所述通用门户模板的变动变成可用状态；

通过点击所述发布按钮发布所述通用门户模板；

所述通用门户模板发布后，所述通用门户模板的版本号和所述登录页面的版本号均加1。

进一步地，一种基于上述操作界面的页面升级系统，包括用户登录页面和页面升级按钮；

所述用户登录页面引用所述通用门户模板的登录页面，并记录引用的页面是“登录”并记录版本号；

当所述通用门户模板升级后，有变动的登录页面的版本号加1得到实际版本号；

系统判断所述用户登录页面所对应的登录页面的版本号，若所述实际版本号大于所述记录版本号，则所述用户登录页面显示更新标志；

根据所述更新标志点击所述页面升级按钮，提示用户是否按照所述通用门户模板的登录页面升级样式更新所述用户登录页面；

若用户确定升级页面，则展示升级后的所述用户登录页面样式；

其中，升级后的所述用户登录页面样式包括：所述用户登录页面中“登录”页面的区域升级成对应的所述通用门户模板的登录页面升级区域样式；所述用户登录页面中非“登录”页面的区域或者所述用户登录页面中已删除的“登录”页面区域不变动。

本技术方案有益效果如下：本发明公开了一种基于网页内元素异同的页面自动更新方法，包括以下步骤：标记a模板中m页面的修改并保存，发布修改后的所述a模板；所述a模板发布后，更新a模板的版本号及修改后的m页面的版本号得到m页面的实际版本号；比较m页面的所述实际版本号与记录版本号后显示所述a模板的更新标志；所述记录版本号为引用所述a模板中m页面的n页面所记录的版本号；根据系统显示的所述a模板的更新标志，确定是否启动页面升级；以及，当确定启动页面升级后，按照a模板更新后的m页面的元素异同更新所述n页面。本发明实现了用户引用的模板升级时自动完成页面的同步升级，且按照模板升级的内容自动升级。

本发明的其他特征和优点将在随后的说明书中阐述，并且，部分的从说明书中变得显而易见，或者通过实施本发明而了解。本发明的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。

附图说明

附图仅用于示出具体实施例的目的，而并不认为是对本发明的限制，在整个附图中，相同的参考符号表示相同的部件。

图1为本发明实施例的一种基于网页内元素异同的页面自动更新方法流程图；

图2为本发明实施例的页面自动更新前提条件示意图；

图3为本发明实施例的页面自动更新时模板重新发布示意图；

图4为本发明实施例的页面自动更新时页面升级示意图。

具体实施方式

下面结合附图来具体描述本发明的优选实施例，其中，附图构成本申请一部分，并与本发明的实施例一起用于阐释本发明的原理，并非用于限定本发明的范围。

本发明的技术构思：用户引用某个由设计人员提供的模板进行页面设计，经过一段时间后，设计人员提供的这个模板很可能做过修改，进行过模板设计，而用户引用这个模板生成的页面也需要同步升级，并且页面升级的内容要和模板升级的内容一致，如果让用户手动对比模板升级的内容去调整会很麻烦。针对上述问题，本发明技术方案实现自动完成页面升级，并尽量按模板升级的内容自动升级。

本发明的一个具体实施例，如图1所示，公开了一种基于网页内元素异同的页面自动更新方法，包括以下步骤：

s1，标记a模板中m页面的修改并保存，发布修改后的所述a模板；

s2，所述a模板发布后，更新a模板的版本号及修改后的m页面的版本号得到m页面的实际版本号；

s3，比较m页面的所述实际版本号与记录版本号后显示所述a模板的更新标志；所述记录版本号为引用所述a模板中m页面的n页面所记录的版本号；

s4，根据系统显示的所述a模板的更新标志，确定是否启动页面升级；以及，当确定启动页面升级后，按照a模板更新后的m页面的元素异同更新所述n页面。

与现有技术相比，本发明技术方案实现了页面元素自动替换，使得用户只需要点击按钮确定即可完成页面自动替换，省时省力。

具体地，根据网页内元素异同进行部分替换的工具包括两个主体功能：一是模板发布，二是页面升级。

本发明的一个具体实施例，所述标记a模板中m页面的修改，包括：将a模板和m页面标记为可变更；并根据所述可变更的标记，将a模板的发布按钮设置为可点击状态；

所述发布修改后的所述a模板，包括：接收对可点击状态的所述a模板的发布按钮的点击操作，发布所述a模板。

本发明的一个具体实施例，所述a模板发布后，更新a模板的版本号及修改后的m页面的版本号得到m页面的实际版本号，包括：所述a模板的版本号和所述m页面的版本号均加1得到实际版本号。a模板的版本号和所述m页面的版本号均可以存储在a模板的版本号表中，在a模板发布后，实时更新a模板的该版本号表。

具体地，模板发布包括以下步骤：

1、a模板的m页面修改过后，标记a模板和m页面有变动。

2、在模板设计器中点击【保存】，因为判断a模板有过变动，所以【发布】按钮会变成可用状态。

3、点击【发布】按钮，将a模板发布。

4、a模板发布后，a模板的版本号，以及有变动的m页面的版本号加1。

本发明的一个具体实施例，所述比较所述实际版本号与记录版本号后显示所述a模板的更新标志包括：所述实际版本号大于所述记录版本号，系统标记n页面可升级，所述n页面显示待升级标志。也就是说，n页面为b项目中的一个页面，其引用了a模板中的m页面；记录版本号为b项目的n页面所记录的版本号，可以存储在b项目的版本号表中。

比较m页面的实际版本号与n页面的记录版本号，包括：在a页面发布后，根据m页面的可变更标记，及m页面与n页面的引用关系，分别从a页面的版本号表和b项目的版本号表中得到m页面的实际版本号和n页面的记录版本号；比较m页面的实际版本号和n页面的记录版本号，若m页面的实际版本号大于n页面的记录版本号，表示m页面已经更新，n页面可以升级，n页面显示待升级标志。待升级标志用于表示n页面此时处于待升级状态，用户可根据需求启动升级操作。

具体地，如图2所示的页面自动更新前提条件：模板a的版本号是v3，模板下的页面都有自己的版本号，可以不相等，页面版本号只能小于等于模板版本号。项目b和其下的页面没有版本号，但是，如果项目b下的页面是引用模板下的页面生成，则会记录引用的页面及其版本号。举例来说：项目b的页面n引用模板a的页面m生成，则页面n会记录引用的页面m且版本号是v2。

如图3所示的页面自动更新时模板重新发布过程：模板a中的页面m做过修改，保存、重新发布，则模板a和页面m的版本号均加1，模板a的版本号由v3变为v4，页面m的版本号由v2变为v3，其它页面由于没有修改，则保持原版本号。

如图4所示的页面自动更新时页面升级过程：由于项目b中页面n记录引用了模板a的页面m的v2版本，当模板a的页面m版本号从v2升级到v3版本后，页面n上会提示引用的模板有更新，是否需要升级，如果用户确认升级，则按升级规则对页面n进行升级。

本发明的一个具体实施例，所述确定是否启动页面升级，包括：接收到用户点击所述n页面显示的待升级标志后触发页面升级功能，系统提示用户是否按照更新后的a模板m页面升级n页面，并展示升级n页面样式；若选择是，则确定启动页面升级。

本发明的一个具体实施例，所述升级n页面样式包括：n页面中所包括的m页面的区域升级成对应m页面的区域的样式，n页面中非m页面的区域或者n页面中已删除的m页面区域不变动。

具体地，页面升级包括以下步骤：

1、n页面引用a模板m页面，n页面会记录引用的页面是m并记录版本号。

2、n页面是在a模板m页面的基础上进行的修改，因此n页面中的区域能和a模板m页面中的区域对应上。

3、当a模板升级后，有变动的m页面的版本号也加1，系统会判断n页面所对应的m页面的版本号，实际版本号比记录版本号大，所以n页面上会有标志说明模板已更新。

4、用户看到模板已更新标志后，点击触发页面升级功能，会提示用户是否要按照a模板m升级样式更新n页面，并展示升级后的n页面样式。

5、升级后的样式是将n页面中m页面的区域按新样式展示，n页面中非m页面的区域(用户自己新增的区域)，或者n页面中已删除的m页面区域不变动。

6、如果用户确定升级页面，保存按新m页面生成的页面。

7、如果用户确定不升级页面，则不做处理。

本发明的一个具体实施例，当确定启动页面升级后，按照a模板更新后的m页面的元素异同更新所述n页面，包括对m页面区域和组件元素的标签id和n页面区域和组件元素的标签id进行对比：

若标签id一致，则判断n页面的该区域组件元素为m页面的区域组件元素后，进行升级处理；

若n页面中存在，而m页面中不存在的标签id，则该区域组件元素为n页面中新增或m页面中被删除的区域组件元素，不进行升级处理；

若n页面中不存在，而m页面中存在的标签id，则该区域组件元素在n页面中被删除或该区域的组件元素为m页面中新增的区域组件元素，不进行升级处理。

需要说明的是，页面可以包括多个区域，每一区域可以包括多个组件元素；当n页面初始引用a模板的m页面时，n页面中的区域和组件元素在html中的标签id与m页面中的区域和组件元素的标签id一致。

本发明的一个具体实施例，结合图2-4所示，所述a模板包括多个页面，所述m页面是a模板中的一个页面；所述n页面为b项目的一个页面，所述b项目包括多个页面。

需要说明的是，当a模板升级(样式做了调整)后，引用a模板设计的b页面，可以使用模板升级功能，将b页面中与a模板能对应的部分，按a模板升级后的内容自动修改。

本发明的一个具体实施例，公开了一种基于上述方法的操作界面，包括：通用门户模板，登录页面，保存按钮和发布按钮；

所述通用门户模板的登录页面修改后，点击所述保存按钮标记所述通用门户模板和所述登录页面的变动；

所述发布按钮根据所述通用门户模板的变动变成可用状态；

通过点击所述发布按钮发布所述通用门户模板；

所述通用门户模板发布后，所述通用门户模板的版本号和所述登录页面的版本号均加1。

具体地，通过操作界面的模板发布如下：

1、“通用门户”模板的“登录”页面修改过后，标记“通用门户”模板和“登录”页面有变动。

2、在模板设计器中点击【保存】，因为判断“通用门户”模板有过变动，所以【发布】按钮会变成可用状态。

3、点击【发布】按钮，将“通用门户”模板发布。

4、“通用门户”模板发布后，“通用门户”模板的版本号，以及有变动的“登录”页面的版本号均加1。

本发明的一个具体实施例，公开了一种基于上述操作界面的页面升级系统，包括用户登录页面和页面升级按钮；

所述用户登录页面引用所述通用门户模板的登录页面，并记录引用的页面是“登录”并记录版本号；

当所述通用门户模板升级后，有变动的登录页面的版本号加1得到实际版本号；

系统判断所述用户登录页面所对应的登录页面的版本号，若所述实际版本号大于所述记录版本号，则所述用户登录页面显示更新标志；

根据所述更新标志点击所述页面升级按钮，提示用户是否按照所述通用门户模板的登录页面升级样式更新所述用户登录页面；

若用户确定升级页面，则展示升级后的所述用户登录页面样式；

其中，升级后的所述用户登录页面样式包括：所述用户登录页面中“登录”页面的区域升级成对应的所述通用门户模板的登录页面升级区域样式；所述用户登录页面中非“登录”页面的区域或者所述用户登录页面中已删除的“登录”页面区域不变动。

具体地，基于操作界面的页面升级如下：

1、“用户登录”页面引用“通用门户”模板“登录”页面，“用户登录”页面会记录引用的页面是“登录”并记录版本号。

2、“用户登录”页面是在“通用门户”模板“登录”页面的基础上进行的修改，因此“用户登录”页面中的区域能和“通用门户”模板“登录”页面中的区域对应上。

3、当“通用门户”模板升级后，有变动的“登录”页面的版本号也加1，系统会判断“用户登录”页面所对应的“登录”页面的版本号，实际版本号比记录版本号大，所以“用户登录”页面上会有标志说明模板已更新。

4、用户看到模板已更新标志后，点击触发页面升级功能，会提示用户是否要按照“通用门户”模板“登录”升级样式更新“用户登录”页面，并展示升级后的“用户登录”页面样式。

5、升级后的样式是将“用户登录”页面中“登录”页面的区域按新样式展示，“用户登录”页面中非“登录”页面的区域(用户自己新增的区域)，或者“用户登录”页面中已删除的“登录”页面区域不变动。

6、如果用户确定升级页面，保存按新“登录”页面生成的页面。

7、如果用户确定不升级页面，则不做处理。

综上所述，本发明公开了一种基于网页内元素异同的页面自动更新方法，包括以下步骤：标记a模板中m页面的修改并保存，发布修改后的所述a模板；所述a模板发布后，更新a模板的版本号及修改后的m页面的版本号得到m页面的实际版本号；比较m页面的所述实际版本号与记录版本号后显示所述a模板的更新标志；所述记录版本号为引用所述a模板中m页面的n页面所记录的版本号；根据系统显示的所述a模板的更新标志，确定是否启动页面升级；以及，当确定启动页面升级后，按照a模板更新后的m页面的元素异同更新所述n页面。本发明实现了用户引用的模板升级时自动完成页面的同步升级，且按照模板升级的内容自动升级，从而解决了在没有页面元素自动替换的情况下，如果模板有升级，页面也需要跟随升级的话，只能用户自己去对照模板手动调整页面，导致工作量大且效果不明显的问题。

本领域技术人员可以理解，实现上述实施例中方法的全部或部分流程，可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于计算机可读存储介质中。其中，所述计算机可读存储介质为磁盘、光盘、只读存储记忆体或随机存储记忆体等。

以上所述，仅为本发明较佳的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到的变化或替换，都应涵盖在本发明的保护范围之内。