页面信息处理方法、设备和存储介质

技术领域

本申请涉及信息处理技术领域，尤其涉及一种页面信息处理方法、设备和存储介质。

背景技术

Loading(载入)页是指在目标页面的数据加载过程中暂时展示的加载页，用于提示电子设备正在下载打开某个页面所需的缓存文件到本地。比如在互动游戏类的H5(HTML5，构建网络内容的一种语言描述方式，其中HTML全称为Hyper Text MarkupLanguage，超文本标记语言)应用，通常进入首屏页之后，在展示首屏页面之前会出现一个全屏显示静态内容的加载中的样式，此为Loading页。

当前技术中，H5互动游戏页面的Loading页与首屏页面的内容一般无关联，在Loading页用户只能看着屏幕等待，从Loading页到首屏页之间没有过渡，整个过程用户体验感比较割裂。

发明内容

本申请实施例的主要目的在于提供一种页面信息处理方法、设备和存储介质，实现了使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。

第一方面，本申请实施例提供一种页面信息处理方法，包括：响应于对目标页面的进入指令；展示所述目标页面对应的预设加载页，在所述目标页面的页面数据加载过程中，在所述预设加载页内展示与所述目标页面的内容关联的第一对象；在所述目标页面的页面数据加载完成时，关闭所述预设加载页，并展示所述目标页面，将所述第一对象保留在所述目标页面中展示。

于一实施例中，所述预设加载页的信息配置在所述目标页面的HTML文档中；所述展示所述目标页面对应的预设加载页，包括：响应于对目标页面的进入指令，获取所述目标页面的HTML文档；解析所述HTML文档，得到所述预设加载页所需的预设素材信息；根据所述预设素材信息，渲染所述预设加载页。

于一实施例中，在所述目标页面的页面数据加载完成时，将所述第一对象保留在所述目标页面中展示，包括：在所述目标页面的页面数据加载完成时，将所述预设加载页中除去所述第一对象以外的第二对象移除，并将所述第一对象移动到目标页面中的指定位置。

于一实施例中，所述将所述第一对象移动到目标页面中的指定位置，包括：按照预设移动方式，将所述第一对象移动到目标页面中的所述指定位置，所述预设移动方式包括：预设位移轨迹和/或预设缩放方式。

于一实施例中，在所述将所述第一对象移动到目标页面中的指定位置之后，还包括：根据所述页面数据确定所述指定位置对应的目标对象，将所述指定位置上的所述第一对象替换成所述目标对象，所述目标对象与所述第一对象相关联。

于一实施例中，所述第一对象包括静态图片；所述目标对象包括与所述静态图片匹配的动态图像。

于一实施例中，所述目标对象的图像分辨率大于所述第一对象的图像分辨率。

于一实施例中，所述在所述目标页面的页面数据加载完成时，关闭所述预设加载页，包括：在关闭所述预设加载页的过程中，播放所述预设加载页对应的离场动画。

于一实施例中，所述页面数据包括：所述目标页面的HTML文档；在所述目标页面的页面数据加载完成时，展示所述目标页面，包括：获取所述目标页面的HTML文档；解析所述HTML文档，生成所述目标页面的文档对象模型；根据所述文档对象模型，渲染所述目标页面。

第二方面，本申请实施例提供一种页面信息处理方法，包括：响应于对电商平台中目标互动内容的进入指令；展示所述目标互动内容的首屏页面对应的预设加载页，在所述首屏页面的页面数据加载过程中，在所述预设加载页内展示与所述首屏页面的内容关联的第一对象；在所述首屏页面的页面数据加载完成时，关闭所述预设加载页，并展示所述首屏页面，将所述第一对象保留在所述首屏页面中展示。

第三方面，本申请实施例提供一种页面信息处理装置，包括：

响应模块，用于响应于对目标页面的进入指令；

第一展示模块，用于展示所述目标页面对应的预设加载页，在所述目标页面的页面数据加载过程中，在所述预设加载页内展示与所述目标页面的内容关联的第一对象；

关闭模块，用于在所述目标页面的页面数据加载完成时，关闭所述预设加载页；

第二展示模块，用于展示所述目标页面，将所述第一对象保留在所述目标页面中展示。

于一实施例中，所述预设加载页的信息配置在所述目标页面的HTML文档中；第一展示模块，用于响应于对目标页面的进入指令，获取所述目标页面的HTML文档；解析所述HTML文档，得到所述预设加载页所需的预设素材信息；根据所述预设素材信息，渲染所述预设加载页。

于一实施例中，第二展示模块，具体用于在所述目标页面的页面数据加载完成时，将所述预设加载页中除去所述第一对象以外的第二对象移除，并将所述第一对象移动到目标页面中的指定位置。

于一实施例中，第二展示模块，具体用于按照预设移动方式，将所述第一对象移动到目标页面中的所述指定位置，所述预设移动方式包括：预设位移轨迹和/或预设缩放方式。

于一实施例中，在所述将所述第一对象移动到目标页面中的指定位置之后，第二展示模块，还用于根据所述页面数据确定所述指定位置对应的目标对象，将所述指定位置上的所述第一对象替换成所述目标对象，所述目标对象与所述第一对象相关联。

于一实施例中，所述第一对象包括静态图片；所述目标对象包括与所述静态图片匹配的动态图像。

于一实施例中，所述目标对象的图像分辨率大于所述第一对象的图像分辨率。

于一实施例中，关闭模块，用于在关闭所述预设加载页的过程中，播放所述预设加载页对应的离场动画。

于一实施例中，所述页面数据包括：所述目标页面的HTML文档；第二展示模块，具体用于获取所述目标页面的HTML文档；解析所述HTML文档，生成所述目标页面的文档对象模型；根据所述文档对象模型，渲染所述目标页面。

第四方面，本申请实施例提供一种电子设备，包括：

至少一个处理器；以及

与所述至少一个处理器通信连接的存储器；

其中，所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述电子设备执行上述任一方面所述的方法。

第五方面，本申请实施例提供一种云设备，包括：

至少一个处理器；以及

与所述至少一个处理器通信连接的存储器；

其中，所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述云设备执行上述任一方面所述的方法。

第六方面，本申请实施例提供一种计算机可读存储介质，所述计算机可读存储介质中存储有计算机执行指令，当处理器执行所述计算机执行指令时，实现上述任一方面所述的方法。

第七方面，本申请实施例提供一种计算机程序产品，包括计算机程序，该计算机程序被处理器执行时实现上述任一方面所述的方法。

本申请实施例提供的页面信息处理方法、设备和存储介质，在当前用户触发进入目标页面的指令时，响应于该指令，首先展示该目标页面对应的预设加载页，在目标页面的页面数据加载过程中，在预设加载页中展示与目标页面内容相关的第一对象，当目标页面的页面数据加载完成时，控制预设加载页离场，进入目标页面，并将原本展示在预设加载页的第一对象保留在目标页面中展示，如此，在关闭预设加载页时，并不直接将预设加载页面的内容全部移出画面，而是保留一部分与目标页面关联的内容，让其继续保留在目标页面内展示，以使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并与说明书一起用于解释本申请的原理。显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1为本申请实施例提供的一种电子设备的结构示意图；

图2为本申请实施例提供的一种页面信息处理方案的应用场景示意图；

图3为本申请实施例提供的一种页面信息处理方法的流程示意图；

图4为本申请实施例提供的一种页面展示场景的流程示意图；

图5为本申请实施例提供的一种页面信息处理方法的流程示意图；

图6为本申请实施例提供的一种一种页面处理流程与页面展示过程的对比示意图；

图7为本申请实施例提供的一种页面信息处理方法的流程示意图；

图8为本申请实施例提供的一种页面信息处理装置的结构示意图；

图9为本申请实施例提供的一种云设备的结构示意图。

通过上述附图，已示出本申请明确的实施例，后文中将有更详细的描述。这些附图和文字描述并不是为了通过任何方式限制本申请构思的范围，而是通过参考特定实施例为本领域技术人员说明本申请的概念。

具体实施方式

这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本申请相一致的所有实施方式。

本文中术语“和/或”，用于描述关联对象的关联关系，具体表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。

需要说明的是，本申请所涉及的用户信息(包括但不限于用户设备信息、用户个人信息等)和数据(包括但不限于用于分析的数据、存储的数据、展示的数据等)，均为经用户授权或者经过各方充分授权的信息和数据，并且相关数据的收集、使用和处理需要遵守相关国家和地区的相关法律法规和标准，并提供有相应的操作入口，供用户选择授权或者拒绝。

为了清楚地描述本申请实施例的技术方案，首先对本申请所涉及的名词进行释义：

HTML：Hyper Text Markup Language，超文本标记语言。

H5：HTML5，是互联网的下一代标准，是构建以及呈现互联网内容的一种语言方式。

Loading页：加载页，比如，在互动游戏类的H5应用，通常进入之后会出现一个全屏显示静态内容的加载中的样式，此为Loading页。

首屏页面：当目标页面加载的内容都准备好之后，关闭Loading页出现的第一屏展示页面即为首屏页面。

JS：JavaScript，一种具有函数优先的轻量级、解释型或即时编译型的编程语言。

DOM：Document Object Model，文档对象模型。

CSS：Cascading Style Sheets，层叠样式表。

如图1所示，本实施例提供一种电子设备1，包括：至少一个处理器11和存储器12，图1中以一个处理器为例。处理器11和存储器12通过总线10连接。存储器12存储有可被处理器11执行的指令，指令被处理器11执行，以使电子设备1可执行下述的实施例中方法的全部或部分流程，以实现使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。

于一实施例中，电子设备1可以是手机、平板电脑、笔记本电脑、台式计算机或者多个计算机组成的大型运算系统。

图2为本申请实施例提供的一种页面信息处理方案的应用场景系统200的示意图。如图2所示，该系统包括：服务器210和终端220，其中：

服务器210可以是提供页面信息处理服务的数据平台，比如可以是电商购物平台，实际场景中，一个电商购物平台可能有多个服务器210，图2中以1个服务器210为例。

终端220可以是用户登录电商购物平台时使用的电脑、手机、平板等设备，终端220也可以有多个，图2中以2个终端220为例进行示意。

终端220与服务器210之间可以通过互联网进行信息传输，以使终端220可以访问服务器210上的数据。上述终端220和/或者服务器210均可以由电子设备1来实现。

本申请实施例的页面信息处理方案可以部署在服务器210上，也可以部署在终端220上，或者部分部署在服务器210上，部分部署在终端220上。实际场景中可以基于实际需求选择，本实施例不做限定。

当页面信息处理方案全部或者部分部署在服务器210上时，可以对终端220开放调用接口，以对终端220提供算法支持。

本申请实施例提供的方法可由电子设备1执行相应的软件代码实现，通过和服务器进行数据交互来实现。其中，电子设备1可以为本地终端设备。当该方法运行于服务器时，该方法则可以基于云交互系统来实现与执行，其中，云交互系统包括服务器和客户端设备。

在一种可能的实施方式中，本发明实施例提供的方法，通过终端设备提供图形用户界面，其中，终端设备可以是前述提到的本地终端设备，也可以是前述提到的云交互系统中的客户端设备。

本申请实施例的页面信息处理方式可以应用于任意需要人机交互的场景中。

Loading(载入)页是指在目标页面的数据加载过程中暂时展示的加载页，用于提示电子设备正在下载打开某个页面所需的缓存文件到本地。比如在互动游戏类的H5(HTML5，构建网络内容的一种语言描述方式，其中HTML全称为Hyper Text MarkupLanguage，超文本标记语言)应用，通常进入首屏页之后，在展示首屏页面之前会出现一个全屏显示静态内容的加载中的样式，此为Loading页。

以电商平台场景为例，随着互联网的发展，通过电商平台进行购物，成为人们文娱生活的重要组成部分。电商场景下，通过在电商平台中嵌入互动活动，来提升电商平台的交互性能已成为广受欢迎的方式之一。在电商平台中嵌入互动活动，可以提升用户与电商平台之间的互动频率，进而提高用户参与互联网购物的积极性，协助互联网电商平台逐渐走向多元化。

以电商平台中嵌入的H5互动游戏为例，互动游戏一般配置有入口，比如在电商平台首页配置互动游戏的入口，用户可以点击入口图标，触发进入游戏页面的指令。在加载游戏页面的过程中，可以先展示Loading页，以提示用户当前正在加载游戏页面。比如相关技术中，在进入H5的Loading阶段为了让用户能先看到一部分内容，可以使用一些静态素材来遮挡住页面，但是这些静态素材通常在首屏加载完成之后就全部丢弃了。并且H5互动游戏页面的Loading页与游戏的首屏页面的内容一般无关联，在Loading页用户只能看着屏幕等待，从Loading页跳到首屏页之间没有信息过渡，整个过程用户体验感比较割裂。

为了解决上述问题，本申请实施例提供一种页面信息处理方案，在当前用户触发进入目标页面的指令时，响应于该指令，首先展示该目标页面对应的预设加载页，在目标页面的页面数据加载过程中，在预设加载页中展示与目标页面内容相关的第一对象，当目标页面的页面数据加载完成时，控制预设加载页离场，进入目标页面，并将原本展示在预设加载页的第一对象保留在目标页面中展示，如此，在关闭预设加载页时，并不直接将预设加载页面的内容全部移出画面，而是保留一部分与目标页面关联的内容，让其继续保留在目标页面内展示，以使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。

下面结合附图，对本申请的一些实施方式作详细说明。在各实施例之间不冲突的情况下，下述的实施例及实施例中的特征可以相互组合。另外，下述各方法实施例中的步骤时序仅为一种举例，而非严格限定。

请参看图3，其为本申请一实施例的页面信息处理方法，该方法可由图1所示的电子设备1来执行，并可以应用于图2中所示的页面信息处理的应用场景中，以实现使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。本实施例以终端220为执行端为例，该方法包括如下步骤：

步骤301：响应于对目标页面的进入指令。

在本步骤中，目标页面可以是针对某种节日、活动专门设置的互动内容的页面，依托于电子设备平台而运行的交互内容，比如电商促销日的线上互动活动的页面，目标页面可以包括一个或多个页面，比如目标页面可以是互动内容的首屏页面。以电商平台的互动内容为例，电商平台的用户首先通过在服务器进行注册，取得可以登录的合法账户。比如用户首先可以通过终端200录入自己的身份信息，向电商平台的服务器申请注册得到自己的账户，用于服务器对其进行身份验证，保证交互信息处理的安全性。

以电商平台中嵌入的H5类型互动游戏为例，互动游戏可以配置有入口，比如在电商平台首页配置互动游戏的入口，用户可以点击入口图标，触发游戏页面的进入指令，此时游戏页面就是目标页面。响应于该进入指令，系统开始加载游戏页面的页面数据，在加载过程中，可以先展示Loading页(即预设加载页)，以提示用户当前正在加载游戏页面。从而让用户第一时间看到的并非白屏，而是有一定内容可见，提高交互体验。

步骤302：展示目标页面对应的预设加载页，在目标页面的页面数据加载过程中，在预设加载页内展示与目标页面的内容关联的第一对象。

在本步骤中，以电商平台中嵌入的H5类型互动游戏为例，系统开始加载游戏页面的页面数据，在加载过程中，可以先展示Loading页(即预设加载页)，以提示用户当前正在加载游戏页面。从而让用户第一时间看到的并非白屏，而是有一定内容可见，提高交互体验。第一对象是预先配置的显示对象，可以包含但不限于图像、文字、音视频等内容。第一对象与用户要进入的目标页面的内容相关联，实际场景中，可以给予目标页面的具体显示内容，来配置对应的预设加载页中需要展示的第一对象。以使预设加载页与目标页面在展示内容上具备关联性。

以电商平台中嵌入的H5类型互动游戏为例，用户点击游戏页面入口，首先展示Loading页，在游戏页面加载过程中，在Loading页中展示与游戏页面的内容有关的第一对象。

如图4所示，为本申请实施例提供的一种Loading页展示示意图，假设互动游戏是闯关类游戏，图4中(a)所示，在终端220的用户界面展示电商平台的首页，首页配置了互动游戏的预设入口，用户点击预设入口的图标，触发进入互动页面的进入指令，进入图4中(b)所示的Loading页。如图4中(b)所示，Loading页中包括文字对象“闯关赢礼品”、六面体图像和云朵图像，其中文字对象“闯关赢礼品”和六面体图像属于预设的与互动游戏内容关联的第一对象，云朵图像是第二对象。另外，Loading页底端可以展示提示信息“加载中……”，以提示用户当前正在加载游戏页面。

第一对象可以向用户提供与互动游戏相关的信息，让用户在等待加载的过程中了解相关信息，提高等待体验。

于一实施例中，预设加载页的信息配置在目标页面的HTML文档中。步骤302具体可以包括：响应于对目标页面的进入指令，获取目标页面的HTML文档。解析HTML文档，得到预设加载页所需的预设素材信息。根据预设素材信息，渲染预设加载页。

在本实施例中，假设目标页面是基于HTML的页面，可以将Loading页需要显示的信息预先配置在目标页面的HTML文档中。HTML文档由一系列标记(tag)组成，一个完整的HTML页面包含HTML标准声明、head标签(头部标签)和body标签(主题标签)等元素。其中，head标签包含了页面的元数据，如页面的Title(名称)、关键字、描述等，而body标签则包含了页面的主体内容。将Loading页需要显示的信息预先配置在目标页面的HTML文档中，可以更快的展示出Loading页。

以电商平台中嵌入的H5类型互动游戏为例，当用户可以点击入口图标，触发游戏页面的进入指令，可以先获取游戏页面的HTML文档，解析游戏页面的HTML文档，得到Loading页所需的预设素材信息，这里预设素材信息可以包括Loading页需要显示的图像、文字等内容。然后根据预设素材信息，渲染Loading页，实现将Loading页在用户界面进行展示。如此，在目标页面的HTML渲染阶段，先渲染Loading页相关的内容，从而让用户第一时间看到的并非白屏，而是有一定内容可见，提高交互体验。

于一实施例中，也可以将预设加载页的信息单独配置一个文件，在用户触发对目标页面的进入指令时，首先获取预设加载页的配置文件，解析配置文件，得到Loading页所需的预设素材信息，然后根据预设素材信息，渲染Loading页，实现将Loading页在用户界面进行展示。

步骤303：在目标页面的页面数据加载完成时，关闭预设加载页，并展示目标页面，将第一对象保留在目标页面中展示。

在本步骤中，在目标页面的页面数据加载完成时，执行Loading页的关闭逻辑，控制预设加载页离场，进入目标页面，并将原本展示在Loading页的第一对象保留在目标页面中展示，如此，在关闭Loading页时，并不直接将Loading页的内容全部移出画面，而是保留一部分与目标页面关联的内容，让其继续保留在目标页面内展示，以使Loading页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。

于一实施例中，步骤303中关闭预设加载页，具体可以包括：在关闭预设加载页的过程中，播放预设加载页对应的离场动画。

在本实施例中，可以为Loading页预先配置离场动画，离场动画比如可以是图4中(b)所示的云朵图像以动画形式向四周散开，如图4中(c)所示，在关闭Loading页的过程中，播放云朵散开的离场动画，以使Loading页以动画形式离场，提高画面灵动感，提高交互体验。

于一实施例中，步骤303具体可以包括：在目标页面的页面数据加载完成时，将预设加载页中除去第一对象以外的第二对象移除，并将第一对象移动到目标页面中的指定位置。

在本实施例中，以电商平台中嵌入的H5类型互动游戏为例，假设目标页面是互动游戏的首屏页面，当首屏页面的页面数据加载完成时，即首屏内容已经准备就绪，可以使用JavaScript执行Loading页离场的逻辑。对于在首屏用不到的素材，比如Loading页中除去第一对象以外的第二对象，可以直接移除，或者执行离场动画之后移除。对于在首屏可以继续用到的素材，比如Loading页中与首屏内容关联的第一对象，将它们移动到在首屏中需要展示的指定位置。比如图4中(b)所示的文字对象“闯关赢礼品”和六面体图像属于预设的与互动游戏内容关联的第一对象，可以将图4中(b)所示的文字对象“闯关赢礼品”和六面体图像移动到首屏中的指定位置，如此实现了将Loading页面的与首屏页关联的内容，继续保留在首屏内展示，以使Loading页到首屏页过渡时具备画面信息关联性，降低割裂感，提高用户体验。

于一实施例中，步骤303中将第一对象移动到目标页面中的指定位置，包括：按照预设移动方式，将第一对象移动到目标页面中的指定位置，预设移动方式包括：预设位移轨迹和/或预设缩放方式。

在本实施例中，对于在首屏可以继续用到的素材，比如Loading页中与首屏内容关联的第一对象，可以预先配置移动方式，比如按照预设位移轨迹将进行移动，或者按照预设缩放方式进行移动，在移动过程中，采用预设移动方式，实现以位移、缩放等动画效果的形式将第一对象移动到在首屏中需要展示的指定位置。

如图4中(d)所示，为本申请实施例提供的关闭图4中(b)所示的Loading页后的首屏页面示意图，在关闭Loading页过程中，预设位移方式可以是文字对象“闯关赢礼品”从页面中间位置向上移动到首屏页面的顶端位置，六面体图像从页面中间位置移动到首屏页面的底端，并在移动过程中按照预设缩放比例缩小。并按照首屏页面的页面数据在首屏页面展示需要的素材，比如展示“积分排行”入口和“兑换道具”入口，以及相关的素材。进一步提高Loading页到首屏页过渡时的画面信息关联性，降低割裂感，提高用户体验。

于一实施例中，在将第一对象移动到目标页面中的指定位置之后，步骤303还可以包括：根据页面数据确定指定位置对应的目标对象，将指定位置上的第一对象替换成目标对象。

在本实施例中，首屏页面中指定位置实际上需要展示的目标对象可能与第一对象是不完全相同的，比如可能对分辨率的要求不一样，或者对显示效果要求不一样，因此为例保证首屏页面按照实际需求进行展示，在将Loading页中可以继续用到的素材(第一对象)移动到首屏页面的指定位置之后，可以根据首屏页面的要求，进行素材替换。首先根据首屏页面的页面数据，确定首屏页面在该指定位置实际上要求展示的目标对象，此处目标对象可以是与第一对象在内容上相关联的显示素材，然后将指定位置上的第一对象替换成目标对象，如此，不仅保证首屏页面按照实际需求进行展示，而且保持显示效果的连贯性。

于一实施例中，第一对象包括静态图片。目标对象包括与静态图片匹配的动态图像。

在本实施例中，假设Loading阶段为了快速展示内容，Loading页中用到的第一对象是物体A的静态图片，而在首屏页面中位置P处要求显示物体A的动画影像，可以在首屏页面加载完正式页面数据素材后，将位置P处的物体A的静态图片替换为物体A的动画影像，动画影像比如可以是基于lottie(一款能够为原生应用添加动画效果的开源工具)、apng(Animated Portable Network Graphics，可移植网络图形动画)、gif(GraphicsInterchange Format，图形交换格式)等格式的动态图像，不仅保证首屏页面按照实际需求进行多样化的效果展示，而且保持显示效果的连贯性。

于一实施例中，目标对象的图像分辨率大于第一对象的图像分辨率。

在本实施例中，假设原本Loading阶段为了快速展示内容，第一对象在Loading页中使用了体积较小的低分辨率的物体A的图像素材，而首屏页面中要求在第一对象所在位置P点使用物体A的高分辨率图像，可以在首屏页面加载完正式的页面数据素材后，将位置P处的物体A的低分辨率图像替换为物体A的高分辨率图像，不仅保证首屏页面按照实际需求的图像分辨率进行多样化的效果展示，而且保持显示效果的连贯性。

于一实施例中，页面数据包括：目标页面的HTML文档。步骤303中展示目标页面，具体可以包括：获取目标页面的HTML文档。解析HTML文档，生成目标页面的文档对象模型。根据文档对象模型，渲染目标页面。

在本实施例中，假设目标页面是基于HTML的页面，目标页面的页面数据可以包括：目标页面的HTML文档，HTML文档由一系列标记(tag)组成，一个完整的HTML页面包含HTML标准声明、head标签(头部标签)和body标签(主题标签)等元素。其中，head标签包含了页面的元数据，如页面的Title(名称)、关键字、描述等，而body标签则包含了页面的主体内容。以前述目标页面为互动游戏的首屏页面为例，当获取首屏页面到HTML文档后，可以先对它进行解析。HTML解析器将HTML文档解析成一种称为DOM(Document Object Model，文档对象模型)的树形结构，每个HTML标签都对应着一个DOM节点。然后可以根据DOM树结构渲染首屏页面。

具体地，在解析完HTML文档得到首屏页面的DOM树结构之后，可以解析首屏的CSS样式，以实现对页面的样式控制。浏览器会将CSS(Cascading Style Sheets，层叠样式表)样式表解析成一份样式规则，并将其应用到DOM树中的各个节点上，使页面呈现出期望的样式。在对DOM树和样式表进行解析之后，可以根据它们构建生成一棵渲染树。渲染树将DOM树中的元素进行关联，同时也考虑了样式表中的布局和视觉效果。渲染树的每个节点都包含了每个元素的视觉信息(如位置、尺寸等)。渲染树构建完毕后，可以对渲染树进行布局，也就是确定每个元素在页面中的位置和大小。可以在渲染树上进行遍历，然后为每个元素计算出其在页面中的位置和大小信息。最后是绘制渲染树，即将渲染树中的每个节点进行绘制。可以根据元素的位置和大小信息，将每个元素对应的内容绘制出来。绘制顺序通常是从背景层到前景层，完成首屏页面的渲染展示过程。

上述页面信息处理方法，在当前用户触发进入目标页面的指令时，响应于该指令，首先展示该目标页面对应的预设加载页，在目标页面的页面数据加载过程中，在预设加载页中展示与目标页面内容相关的第一对象，当目标页面的页面数据加载完成时，控制预设加载页离场，进入目标页面，并将原本展示在预设加载页的第一对象保留在目标页面中展示，如此，在关闭预设加载页时，并不直接将预设加载页面的内容全部移出画面，而是保留一部分与目标页面关联的内容，让其继续保留在目标页面内展示，不仅提升了素材的利用率，而且使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。

请参看图5，其为本申请一实施例的页面信息处理方法，该方法可由图1所示的电子设备1来执行，并可以应用于图2中所示的页面信息处理的应用场景中，以实现使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。本实施例以终端220为执行端为例，与前述实施例相比，本实施例以基于H5的互动页面处理场景为例，该方法包括如下步骤：

步骤501：响应于对目标页面的进入指令，获取目标页面的HTML文档。

步骤502：解析HTML文档，得到预设加载页所需的预设素材信息。

步骤503：根据预设素材信息，渲染预设加载页。

步骤504：在目标页面的页面数据加载过程中，在预设加载页内展示与目标页面的内容关联的第一对象。

步骤505：在目标页面的页面数据加载完成时，关闭预设加载页，在关闭预设加载页的过程中，播放预设加载页对应的离场动画，展示目标页面。

步骤506：将预设加载页中除去第一对象以外的第二对象移除，并按照预设移动方式，将第一对象移动到目标页面中的指定位置，预设移动方式包含但不限于：预设位移轨迹和/或预设缩放方式。

步骤507：根据页面数据确定指定位置对应的目标对象，将指定位置上的第一对象替换成目标对象，目标对象与第一对象相关联。

如图6所示，为本申请实施例提供的一种页面处理流程与页面展示过程的对比示意图，结合前述图4所示的页面，以电商平台中嵌入的H5互动游戏为例，包括：

首先用户点击“预设入口”图标，触发H5页面的进入指令，加载H5页面的HTML文档，解析HTML文档，HTML文档完毕后，得到Loading页的配置信息，渲染Loading页，此时在用户界面展示图4中(b)所示的Loading页。

另一方面，系统加载H5页面的页面数据，比如加载JS、CSS数据，业务脚本开始执行，请求首屏接口，并且加载首屏素材，首屏准备就绪时，开始关闭Loading遮罩，此时用户界面展示如图4中(c)所示的Loading页离场动画，“闯关赢礼品”文本对象和六面体图像分别按照预设移动方式移动到指定位置。等Loading页关闭动画结束，完全进入首屏页面，此时用户界面展示图4中(d)所示的首屏页面。

上述方法的各个步骤，详细可以参阅前述有关实施例的相关描述，此处不再赘述。

请参看图7，其为本申请一实施例的页面信息处理方法，该方法可由图1所示的电子设备1来执行，并可以应用于图2中所示的页面信息处理的应用场景中，以实现使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。本实施例以终端220为执行端为例，与前述实施例相比，本实施例以电商平台中嵌入的H5互动游戏为例，该方法包括如下步骤：

步骤701：响应于对电商平台中目标互动内容的进入指令。

在本步骤中，目标互动内容可以是电商平台中嵌入的H5互动游戏，比如图4中所示的闯关游戏，以首屏页面作为目标页面为例，详细参见前述实施例对步骤301的相关描述。

步骤702：展示目标互动内容的首屏页面对应的预设加载页，在首屏页面的页面数据加载过程中，在预设加载页内展示与首屏页面的内容关联的第一对象。详细参见前述实施例对步骤302的相关描述。

步骤703：在首屏页面的页面数据加载完成时，关闭预设加载页，并展示首屏页面，将第一对象保留在首屏页面中展示。详细参见前述实施例对步骤303的相关描述。

上述方法的各个步骤，详细可以参阅前述有关实施例的相关描述，此处不再赘述。

请参看图8，其为本申请一实施例的页面信息处理装置800，该装置可应用于图1所示的电子设备1。并可以应用于图2中所示的页面信息处理的应用场景中，以实现使预设加载页到目标页面页过渡过程中具备画面信息关联性，降低割裂感，提高用户体验。该装置包括：响应模块801、第一展示模块802、关闭模块803和第二展示模块804，各个模块的功能原理如下：

响应模块801，用于响应于对目标页面的进入指令。

第一展示模块802，用于展示目标页面对应的预设加载页，在目标页面的页面数据加载过程中，在预设加载页内展示与目标页面的内容关联的第一对象。

关闭模块803，用于在目标页面的页面数据加载完成时，关闭预设加载页。

第二展示模块804，用于展示目标页面，将第一对象保留在目标页面中展示。

于一实施例中，预设加载页的信息配置在目标页面的HTML文档中。响应模块801，用于响应于对目标页面的进入指令，获取目标页面的HTML文档。解析HTML文档，得到预设加载页所需的预设素材信息。根据预设素材信息，渲染预设加载页。

于一实施例中，第二展示模块804，具体用于在目标页面的页面数据加载完成时，将预设加载页中除去第一对象以外的第二对象移除，并将第一对象移动到目标页面中的指定位置。

于一实施例中，第二展示模块804，具体用于按照预设移动方式，将第一对象移动到目标页面中的指定位置，预设移动方式包括：预设位移轨迹和/或预设缩放方式。

于一实施例中，在将第一对象移动到目标页面中的指定位置之后，第二展示模块804，还用于根据页面数据确定指定位置对应的目标对象，将指定位置上的第一对象替换成目标对象，目标对象与第一对象相关联。

于一实施例中，第一对象包括静态图片。目标对象包括与静态图片匹配的动态图像。

于一实施例中，目标对象的图像分辨率大于第一对象的图像分辨率。

于一实施例中，关闭模块803，用于在关闭预设加载页的过程中，播放预设加载页对应的离场动画。

于一实施例中，页面数据包括：目标页面的HTML文档。第二展示模块804，具体用于获取目标页面的HTML文档。解析HTML文档，生成目标页面的文档对象模型。根据文档对象模型，渲染目标页面。

上述页面信息处理装置800的详细描述，请参见上述实施例中相关方法步骤的描述，其实现原理和技术效果类似，本实施例此处不再赘述。

图9为本申请示例性实施例提供的一种云设备90的结构示意图。该云设备90可以用于运行上述任一实施例所提供的方法。如图9所示，该云设备90可以包括：存储器904和至少一个处理器905，图9中以一个处理器为例。

存储器904，用于存储计算机程序，并可被配置为存储其它各种数据以支持在云设备90上的操作。该存储器904可以是对象存储(Object Storage Service，OSS)。

存储器904可以由任何类型的易失性或非易失性存储设备或者它们的组合实现，如静态随机存取存储器(SRAM)，电可擦除可编程只读存储器(EEPROM)，可擦除可编程只读存储器(EPROM)，可编程只读存储器(PROM)，只读存储器(ROM)，磁存储器，快闪存储器，磁盘或光盘。

处理器905，与存储器904耦合，用于执行存储器904中的计算机程序，以用于实现上述任一方法实施例所提供的方案，具体功能和所能实现的技术效果此处不再赘述。

进一步地，如图9，该云设备还包括：防火墙901、负载均衡器902、通信组件906、电源组件903等其它组件。图9中仅示意性给出部分组件，并不意味着云设备只包括图9所示组件。

于一实施例中，上述图9中的通信组件906被配置为便于通信组件906所在设备和其他设备之间有线或无线方式的通信。通信组件906所在设备可以接入基于通信标准的无线网络，如WiFi，2G、3G、4G、LTE(Long Term Evolution，长期演进，简称LTE)、5G等移动通信网络，或它们的组合。在一个示例性实施例中，通信组件906经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中，通信组件906还包括近场通信(Near Field Communication，简称NFC)模块，以促进短程通信。例如，在NFC模块可基于射频识别(Radio Frequency Identification，简称RFID)技术，红外数据协会(InfraredData Association，简称IrDA)技术，超宽带(Ultra Wide Band，简称UWB)技术，蓝牙(bluetooth，简称BT)技术和其他技术来实现。

于一实施例中，上述图9的电源组件903，为电源组件903所在设备的各种组件提供电力。电源组件903可以包括电源管理系统，一个或多个电源，及其他与为电源组件所在设备生成、管理和分配电力相关联的组件。

本申请实施例还提供一种计算机可读存储介质，计算机可读存储介质中存储有计算机执行指令，当处理器执行计算机执行指令时，实现前述任一实施例的方法。

本申请实施例还提供一种计算机程序产品，包括计算机程序，该计算机程序被处理器执行时实现前述任一实施例的方法。

在本申请所提供的几个实施例中，应该理解到，所揭露的设备和方法，可以通过其它的方式实现。例如，以上所描述的设备实施例仅仅是示意性的，例如，模块的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个模块可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。

上述以软件功能模块的形式实现的集成的模块，可以存储在一个计算机可读取存储介质中。上述软件功能模块存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)或处理器执行本申请各个实施例方法的部分步骤。

应理解，上述处理器可以是中央处理单元(Central Processing Unit，简称CPU)，还可以是其它通用处理器、数字信号处理器(Digital Signal Processor，简称DSP)、专用集成电路(Application Specific Integrated Circuit，简称ASIC)等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。结合申请所公开的方法的步骤可以直接体现为硬件处理器执行完成，或者用处理器中的硬件及软件模块组合执行完成。存储器可能包含高速RAM(Random Access Memory，随机存取存储器)存储器，也可能还包括非易失性存储NVM(Nonvolatile memory，简称NVM)，例如至少一个磁盘存储器，还可以为U盘、移动硬盘、只读存储器、磁盘或光盘等。

上述存储介质可以是由任何类型的易失性或非易失性存储设备或者它们的组合实现，如静态随机存取存储器(Static Random-Access Memory，简称SRAM)，电可擦除可编程只读存储器(Electrically Erasable Programmable read only memory，简称EEPROM)，可擦除可编程只读存储器(Erasable Programmable Read-Only Memory，简称EPROM)，可编程只读存储器(Programmable read-only memory，简称PROM)，只读存储器(Read-OnlyMemory，简称ROM)，磁存储器，快闪存储器，磁盘或光盘。存储介质可以是通用或专用计算机能够存取的任何可用介质。

一种示例性的存储介质耦合至处理器，从而使处理器能够从该存储介质读取信息，且可向该存储介质写入信息。当然，存储介质也可以是处理器的组成部分。处理器和存储介质可以位于专用集成电路(Application Specific Integrated Circuits，简称ASIC)中。当然，处理器和存储介质也可以作为分立组件存在于电子设备或主控设备中。

需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。

上述本申请实施例序号仅仅为了描述，不代表实施例的优劣。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，空调器，或者网络设备等)执行本申请各个实施例的方法。

本申请的技术方案中，所涉及的用户数据等信息的收集、存储、使用、加工、传输、提供和公开等处理，均符合相关法律法规的规定，且不违背公序良俗。

以上仅为本申请的优选实施例，并非因此限制本申请的专利范围，凡是利用本申请说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本申请的专利保护范围内。