CN113918850A - 样式自动纠偏的方法、电子设备及存储介质 - Google Patents

Abstract

本发明公开了一种样式自动纠偏的方法、电子设备及存储介质，可应用至电子书在快应用、小程序、浏览器网页进行显示的场景，上述方法包括：获取待显示的页面信息；根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象；当确定上述样式信息中存在上述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。根据预定义的待更正对象与更正逻辑之间的关联关系，对目标对象进行纠偏处理，实现对不适配样式代码的自动查找和自动纠偏，得到适配于当前显示界面的更正样式信息，以实现样式的正常显示。

Description

样式自动纠偏的方法、电子设备及存储介质

技术领域

本公开涉及互联网领域，尤其涉及一种样式自动纠偏的方法、电子设备及存储介质。

背景技术

随着互联网技术的发展，在电子阅读领域，电子书能够以各种形式进行呈现。用户可以通过客户端应用程序(例如电子书阅读APP)、网页(例如浏览器)、小程序或者快应用(快应用是移动互联网新型应用生态，与手机系统深度整合，具备传统APP完整的应用体验，但无需安装、即点即用)加载的H5(Hyper Text Markup Language 5，第5版超文本标记语言)页面来进行电子书的阅读。

从电子书的网页开发而言，大部分Epub标准(一种由国际数字出版论坛(IDPF)提出的电子图书标准)的电子书的内容显示网页是采用可扩展超文本标记语言(xhtml)编写的文档类型，在电子书阅读APP上可以通过客户端引擎对上述文档对应的页面进行渲染，能够实现较佳的显示效果；然而，当上述文档应用于网页、小程序或H5页面进行显示时，会产生样式显示的各种问题，诸如内容错位叠加、页面留白过多、图片被截断等。

发明内容

为了解决上述技术问题或者至少部分地解决上述技术问题，本公开的实施例提供了一种样式自动纠偏的方法、电子设备及存储介质。

第一方面，本公开的实施例提供了一种样式自动纠偏的方法。上述方法包括：获取待显示的页面信息；根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象；当确定上述样式信息中存在上述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。

第二方面，本公开的实施例提供了一种电子设备。上述电子设备包括处理器、通信接口、存储器和通信总线，其中，处理器、通信接口和存储器通过通信总线完成相互间的通信。上述存储器用于存放至少一可执行指令，上述可执行指令使得上述处理器执行以下步骤：获取待显示的页面信息；根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象；当确定上述样式信息中存在上述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，上述根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象，包括：根据样式信息的标识，定位至上述页面信息中的样式信息；根据预设的待更正对象列表，检测上述样式信息中是否包含与上述待更正对象列表中的一个或多个待更正对象相匹配的特定代码信息；当上述样式信息中存在特定代码信息时，确定上述特定代码信息为需要进行纠偏的目标对象。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，上述待更正对象与上述预设更正逻辑之间为一对一或一对多的关联关系。其中，上述根据待更正对象与预设更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息，包括：根据待更正对象与预设更正逻辑之间的关联关系，确定上述目标对象对应的一个或多个候选处理逻辑；当上述目标对象对应的候选处理逻辑为一个时，根据上述候选处理逻辑对上述目标对象进行纠偏处理，得到纠偏后的样式信息，上述纠偏后的样式信息为更正样式信息；当上述目标对象对应的候选处理逻辑为多个时，根据上述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑中确定与上述目标功能对应的目标处理逻辑；根据上述目标处理逻辑对上述目标对象进行纠偏处理，得到纠偏后的样式信息，上述纠偏后的样式信息为更正样式信息。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，针对一对多的关联关系，关联于同一个待更正对象的多个预设更正逻辑绑定有各自对应的功能标识，上述功能标识用于限定当前预设更正逻辑是针对具有特定功能的待更正对象出现的问题而设置的。其中，上述根据上述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑中确定与上述目标功能对应的目标处理逻辑，包括：根据上述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑的功能标识或多个候选处理逻辑所对应的关联关系的功能标识中进行匹配；当存在与上述目标功能匹配的目标功能标识时，确定上述目标功能标识所对应的预设候选处理逻辑为目标处理逻辑。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法还包括以下步骤，或者上述第二方面提供的电子设备中，上述可执行指令还使得上述处理器执行以下步骤：生成待更正对象列表和待更正对象与更正逻辑之间的关联关系。其中，上述生成待更正对象列表和待更正对象与更正逻辑之间的关联关系，包括：获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息；根据上述样式代码信息，生成待更正对象列表；根据上述样式代码信息和对应的处理逻辑信息，生成待更正对象与更正逻辑之间的关联关系。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，上述获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息，包括以下至少一种：获取用户输入的不适配样式代码的示例信息和针对上述不适配样式代码的处理逻辑信息；或者，获取用户在调试过程中对已编写好前端样式的代码文档进行纠偏的历史纠偏数据，并根据上述历史纠偏数据和调试过程中的界面显示信息，确定不适配于当前显示界面的样式代码信息和对应的处理逻辑信息。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，上述根据上述样式代码信息和对应的处理逻辑信息，生成待更正对象与更正逻辑之间的关联关系，包括：当上述样式代码信息对应有多个处理逻辑信息时，根据上述样式代码信息所要实现的功能，为每个样式代码信息所对应的多个处理逻辑信息绑定各自对应的功能标识；将上述样式代码信息作为待更正对象，将与上述样式代码信息对应的处理逻辑信息作为更正逻辑，生成与上述功能标识相关的关联关系。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法还包括以下步骤，或者上述第二方面提供的电子设备中，上述可执行指令还使得上述处理器执行以下步骤：接收对上述关联关系进行更新的更新信息；以及根据上述更新信息，对上述待更正对象列表和上述关联关系进行更新。对上述关联关系进行更新包括以下至少一种：对上述关联关系中的待更正对象进行更新、对上述关联关系中的更正逻辑进行更新、对上述待更正对象与上述更正逻辑之间的对应关系进行更新。其中，上述根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，包括：根据更新后的待更正对象列表，对上述页面信息中的样式信息进行检测。上述根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，包括：根据更新后的关联关系，对上述目标对象进行纠偏处理。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，上述待更正对象包括：显示位置设置错误、无效、不合理对应的第一设置参数，对齐相关的第二设置参数、导致内容显示不完整所对应的第三设置参数、浮动设置不合理对应的第四设置参数、多元素布局不合理对应的第五设置参数。上述更正逻辑包括：基于预设值替换待更正对象中的参数设置值；对待更正对象中的语法进行更正；将待更正对象中的设置参数转换为符合当前显示界面的语法规范的替代参数，并增补替代参数对应的参数预设值；将待更正对象中的设置参数替换为新参数，增补新参数对应的参数预设值和与上述新参数关联的关联参数信息。

根据本公开的实施例，上述第一方面提供的样式自动纠偏的方法和上述第二方面提供的电子设备中，上述待显示的页面信息为采用可扩展超文本标记语言xhtml编写的电子书文档格式，上述当前显示界面包括：浏览器网页、小程序界面或快应用中加载的H5页面。

第三方面，本公开的实施例提供了一种计算机可读存储介质。上述计算机可读存储介质上存储有计算机程序，上述计算机程序被处理器执行时实现如上所述的样式自动纠偏的方法。

上述实施例中的一个或多个技术方案至少具有如下优点的部分或全部：

通过对获取到的待显示的页面信息(例如为符合Epub标准的xhtml页面代码文档中的信息)中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象，上述目标对象为不适配当前显示界面的规范格式(例如为H5页面的编写规范)的样式代码，当确定上述样式信息中存在上述目标对象时，根据预定义的待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，实现了不适配样式代码的自动查找和自动纠偏，能够得到适配于当前显示界面的更正样式信息，确保获取到的页面信息能够在当前显示界面正常显示。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。

为了更清楚地说明本公开实施例或现有技术中的技术方案，下面将对实施例或相关技术描述中所需要使用的附图作简单地介绍，显而易见地，对于本领域普通技术人员而言，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1示意性地示出了适用于本公开实施例的样式自动纠偏的方法的系统架构；

图2示意性地示出了根据本公开一实施例的样式自动纠偏的方法的流程图；

图3示意性地示出了根据本公开实施例的步骤S202的详细实施流程图；

图4示意性地示出了根据本公开实施例的步骤S203的详细实施流程图；

图5示意性地示出了根据本公开另一实施例的样式自动纠偏的方法的流程图；

图6示意性地示出了根据本公开实施例的生成待更正对象列表和待更正对象与更正逻辑之间的关联关系的详细实施流程图；

图7示意性地示出了根据本公开又一实施例的样式自动纠偏的方法的流程图；以及

图8示意性示出了本公开实施例提供的电子设备的结构框图。

具体实施方式

本公开的实施例提供了一种样式自动纠偏的方法、电子设备及存储介质。上述方法包括：获取待显示的页面信息；根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象；当确定上述样式信息中存在上述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。

上述方法中，基于待更正列表和待更正对象与更正逻辑之间的关联关系，能够实现对获取到的待显示的页面信息中的样式信息中不适配样式代码的自动查找和自动纠偏，得到适配于当前显示界面的更正样式信息，确保获取到的页面信息能够在当前显示界面正常显示。

为使本公开实施例的目的、技术方案和优点更加清楚，下面将结合本公开实施例中的附图，对本公开实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本公开的一部分实施例，而不是全部的实施例。基于本公开中的实施例，本领域普通技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本公开保护的范围。

图1示意性地示出了适用于本公开实施例的样式自动纠偏的方法的系统架构。

参照图1所示，适用于本公开实施例的样式自动纠偏的方法的系统架构100包括：终端设备101、102、103，网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等。

用户可以使用终端设备101、102、103通过网络104与服务器105交互，以接收或发送消息等。终端设备101、102、103上可以安装有各种通讯客户端应用，诸如：电子书阅读类软件/应用、网页浏览器应用、搜索类应用、新闻客户端应用、即时通信工具、外卖类应用、社交平台软件、购物类应用、短视频应用等(仅为示例)。

终端设备101、102、103可以是具有显示屏并且支持文本、图片、视频等至少一种播放的电子设备，或者上述终端设备101、102、103也可以是具有显示屏并且支持网页浏览的电子设备。例如，上述电子设备可以包括但不限于是：智能手机、平板电脑、笔记本电脑、台式计算机、智能手表等。

服务器105可以是提供各种服务的服务器，例如对用户利用终端设备101、102、103所浏览的应用界面或者网页提供服务支持的后台管理服务器(仅为示例)。后台管理服务器可以对接收到的请求进行分析和处理，并将处理结果(例如根据用户请求获取或生成的网页、信息、或数据等)反馈给终端设备。

需要说明的是，本公开实施例所提供的样式自动纠偏的方法一般可以由终端设备或服务器来执行。

本公开的实施例中，在一样式规范化工具包(例如为Epub样式纠偏软件包)中包含上述样式自动纠偏的方法中关于样式信息检测和纠偏处理的可执行指令的执行逻辑。

在一应用场景中，该样式规范化工具包可以安装于终端设备上。服务器将待显示的页面信息发送给终端设备。在终端设备从服务器获取到待显示的页面信息后，基于该样式规范化工具来实现样式的自动检测和纠偏，得到更正样式信息后，终端设备基于上述更正样式信息来进行页面内容的显示。

在另一可拓展的应用场景中，上述样式规范化工具包可以是设置于服务器中，由服务器获取用于在终端设备上进行显示的待显示的页面信息，然后基于上述样式规范化工具包来执行样式信息检测和纠偏处理的逻辑，得到适配于当前显示界面的更正样式信息。之后，服务器可以将上述更正样式信息发送给终端设备，由终端设备基于上述更正样式信息来进行页面内容的显示。

应该理解，图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。

尽管上述场景以电子阅读场景下应用上述样式自动纠偏的方法作为示例，可以理解的是，本公开实施例提供的技术方案的应用场景不局限于电子阅读场景，可以拓展至任何需要进行样式纠偏的场景。

下面结合附图来对本公开的实施例进行详细介绍。

本公开的第一个示例性实施例提供了一种样式自动纠偏的方法。

图2示意性地示出了根据本公开一实施例的样式自动纠偏的方法的流程图。

参照图2所示，本公开实施例提供的样式自动纠偏的方法，包括以下步骤：S201、S202和S203。该步骤S201～S203可以由用于进行内容显示的终端设备执行，也可以由为上述内容显示提供服务支持的服务器来执行，具体描述可以参照前述关于应用场景的示例，这里不再赘述。

在步骤S201，获取待显示的页面信息。

示例性的，上述待显示的页面信息为采用xhtml编写的电子书文档格式(适用于电子书阅读APP)，上述待显示的页面信息可以是符合电子书Epub标准的xhtml页面代码文档中的信息。

上述待显示的页面信息用于在终端设备的当前显示界面进行显示，当前显示界面包括但不限于是：浏览器网页、小程序界面或快应用中加载的H5页面等。

在步骤S202，根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象。

预设的待更正对象列表中包括一个或多个待更正对象，上述待更正对象包括：采用xhtml编写的电子书文档中不适配于当前显示界面的样式代码。

例如，上述待更正对象包括：margin-top(CSS中的一个属性，用于设置元素的上外边距)：-30％(用于在电子书阅读APP中实现偏移出页面的效果)；margin(外边距)左右-30％，padding(内边距)再左右30％等样式代码。提及的各个代码所表示的含义为本领域技术人员熟知的含义，不做详细介绍。

基于上述待更正对象列表，可以对页面信息中的样式信息进行自动检测，以查找到样式信息中需要进行纠偏的目标对象。

在步骤S203，当确定上述样式信息中存在上述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。

待更正对象与更正逻辑之间的关联关系是预先生成的，针对某一个待更正对象，对应进行处理的更正逻辑可以是一个或者多个。例如，针对待更正对象：margin-top(上外边距)：30％，对应的一个更正逻辑可以是：将margin-top(上外边距)：-30％替换为margin-top(上外边距)：0。

通过基于上述待更正对象与更正逻辑之间的关联关系，可以通过对应的更正逻辑来对目标对象进行纠偏处理，得到纠偏后的样式信息，纠偏后的样式信息为更正样式信息，能够适配于当前显示界面，从而使得包含更正样式信息的页面信息在当前显示界面能够正常显示。

基于上述步骤S201～S203，通过对获取到的待显示的页面信息(例如为符合Epub标准的xhtml页面代码文档中的信息)中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象，上述目标对象为不适配当前显示界面的规范格式(例如为H5页面的编写规范)的样式代码，当确定上述样式信息中存在上述目标对象时，根据预定义的待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，实现了不适配样式代码的自动查找和自动纠偏，能够得到适配于当前显示界面的更正样式信息，确保获取到的页面信息能够在当前显示界面正常显示。

以电子书为例，在电子书的xhtml页面代码文档中(适配于电子阅读APP，一个显示页面对应于一个代码文档)，通常是一页电子书内容对应于一个body(网页的主体内容)，多页电子书内容具有多个body，在页面代码文档中会定义有电子书内容的样式信息。如果将xhtml页面代码文档直接应用至诸如浏览器网页、小程序或者快应用的H5页面等进行渲染，以渲染至H5页面为例，一般而言电子书的多页会上下依序铺开，用户通过上下拉动实现在一个网页上对多页电子书内容的阅读，而在这种情况下，由于原先的xhtml页面代码文档中的样式代码的编写是适用于电子书阅读APP的一页一页单独展示的方式，其样式设置在浏览器网页、小程序或者快应用中的H5页面会产生非正常显示的问题。另外，针对单独页的显示，根据之前习惯(适配于电子阅读APP的设置参数)设置的某些参数也会导致在当前显示界面不适配的情况，从而导致产生诸如内容错位叠加、页面留白过多、图片被截断等非正常显示的问题。

通过实施上述步骤S201～S203，基于待更正列表和待更正对象与更正逻辑之间的关联关系，能够实现对获取到的电子书中待显示的页面信息中的样式信息中不适配样式代码的自动查找和自动纠偏，得到适配于当前显示界面(例如H5页面)的更正样式信息，确保获取到的页面信息能够在当前显示界面正常显示。

应该理解的是，只要待显示的页面信息与实际要进行显示的当前显示界面二者之间的样式代码的大体框架兼容，只是存在样式代码的设置不适配于当前显示界面，均可以应用本公开实施例提供的样式自动纠偏的方法，不局限于上述实施例示例的xhtml页面代码文档中的信息与浏览器网页、小程序界面或快应用中加载的H5页面。

图3示意性地示出了根据本公开实施例的步骤S202的详细实施流程图。

根据本公开的实施例，参照图3所示，上述步骤S202中，根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象，包括以下步骤：S301、S302和S303。

在步骤S301，根据样式信息的标识，定位至上述页面信息中的样式信息。

上述页面信息除了包括样式信息之外，还可以包括：网页内容，网页说明信息等。在一实施例中，符合电子书Epub标准的xhtml页面代码文档中的信息(页面信息的一种示例)中，样式信息的标识例如为：style，具体样式内容的标识可以是：height，width，position，bottom，vertical-align，display，margin，padding，color，overflow，transform，size等。

在步骤S302，根据预设的待更正对象列表，检测上述样式信息中是否包含与上述待更正对象列表中的一个或多个待更正对象相匹配的特定代码信息。

在步骤S303，当上述样式信息中存在特定代码信息时，确定上述特定代码信息为需要进行纠偏的目标对象。

基于步骤S301～S303，通过根据待更正对象列表来对定位到的样式信息进行检测匹配，当检测到与待更正列表中的一个或多个待更正对象相匹配的特定代码信息时，可以确定该特定代码信息作为需要进行纠偏的目标对象，实现对页面信息中不适配的样式代码的自动化查找。

图4示意性地示出了根据本公开实施例的步骤S203的详细实施流程图。

上述待更正对象与上述预设更正逻辑之间为一对一或一对多的关联关系。

根据本公开的实施例，参照图4所示，上述步骤S203中，根据待更正对象与预设更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息，包括以下步骤：S401，S402a，S402b和S403b。

在步骤S401，根据待更正对象与预设更正逻辑之间的关联关系，确定上述目标对象对应的一个或多个候选处理逻辑。

当上述目标对象对应的候选处理逻辑为一个时，执行步骤S402a。

在步骤S402a，根据上述候选处理逻辑对上述目标对象进行纠偏处理，得到纠偏后的样式信息，上述纠偏后的样式信息为更正样式信息。

当上述目标对象对应的候选处理逻辑为多个时，执行步骤S402b和S403b。

在步骤S402b，当上述目标对象对应的候选处理逻辑为多个时，根据上述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑中确定与上述目标功能对应的目标处理逻辑。

目标对象所处的语句限定的目标功能包括：位置功能、对齐功能、显示功能、多元素之间的布局等。

例如，“margin-top：30％”这个目标对象出现在两个语句，其中一个语句限定的是位置功能，由于其设定的参数值过大，在H5页面中显示会导致标题和图片间距过大；另一个语句限定的是多元素之间的布局，出现了一个元素为“margin-top：10％”，另一个元素为“margin-bottom：5％”，会产生父子元素、兄弟元素之间的margin塌陷(父元素在垂直方向(屏幕的y方向)上的限制对子元素来说没有作用)、margin合并(两个并列的兄弟元素之间，它们的margin-bottom和margin-top合并了，并且显示的是较大值，实际沿着垂直方向上的间距并非二者限定间距之和)的问题。

示例性的，位置功能所对应的目标处理逻辑例如为：基于预设值替换待更正对象中的参数设置值，例如将“margin-top：30％”替换为“margin-top：0”；多元素之间的布局功能所对应的目标处理逻辑例如为：将待更正对象中的设置参数替换为新参数，增补新参数对应的参数预设值和与上述新参数关联的关联参数信息。例如给子元素设置float/position属性使其脱离文档流(常规文档流(非float和绝对定位)的块级盒子)，或者给父元素设置border/padding，然后将其box-size属性设置为border-box/padding-box等等。

在步骤S403b，根据上述目标处理逻辑对上述目标对象进行纠偏处理，得到纠偏后的样式信息，上述纠偏后的样式信息为更正样式信息。

根据本公开的实施例，针对一对多的关联关系，关联于同一个待更正对象的多个预设更正逻辑绑定有各自对应的功能标识，上述功能标识用于限定当前预设更正逻辑是针对具有特定功能的待更正对象出现的问题而设置的。

其中，上述步骤S402b中，根据上述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑中确定与上述目标功能对应的目标处理逻辑，包括：根据上述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑的功能标识或多个候选处理逻辑所对应的关联关系的功能标识中进行匹配；当存在与上述目标功能匹配的目标功能标识时，确定上述目标功能标识所对应的预设候选处理逻辑为目标处理逻辑。

图5示意性地示出了根据本公开另一实施例的样式自动纠偏的方法的流程图。

根据本公开的实施例，参照图5所示，上述样式自动纠偏的方法除了包括上述步骤S201～S203之外，还可以进一步包括以下步骤：S501，生成待更正对象列表和待更正对象与更正逻辑之间的关联关系。该步骤S501在步骤S202和S203之前执行，并且在一定的时间段内(关联关系的有效时间段)，可以基于步骤S501生成得到的关联关系，执行多次步骤S201～S203。

图6示意性地示出了根据本公开实施例的生成待更正对象列表和待更正对象与更正逻辑之间的关联关系的详细实施流程图。

参照图6所示，上述步骤S501中，生成待更正对象列表和待更正对象与更正逻辑之间的关联关系，包括以下步骤：S601、S602和S603。

在步骤S601，获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息。

不适配于当前显示界面的样式代码信息是指与当前显示界面的显示规范(例如为H5页面的显示规范)不适配的一些样式代码信息，这些样式代码信息可以是由研发人员直接输入的，对应的处理逻辑信息可以是研发人员自定义的。这些样式代码信息还可以研发人员在对前端代码文件(例如为采用xhtml编写的电子书文档)的显示效果进行调试过程中产生的，对应的处理逻辑信息是研发人员实际采用的处理方案。

在一种实施例中，上述获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息，包括：获取用户输入的不适配样式代码的示例信息和针对上述不适配样式代码的处理逻辑信息。

在另一种实施例中，上述获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息，包括：获取用户在调试过程中对已编写好前端样式的代码文档进行纠偏的历史纠偏数据，并根据上述历史纠偏数据和调试过程中的界面显示信息，确定不适配于当前显示界面的样式代码信息和对应的处理逻辑信息。

在其他实施例中，步骤S601的实现方式也可以是同时包含上述两种实施例的方法，即，同时包括获取用户输入的相关信息(不适配于当前显示界面的样式代码信息和对应的处理逻辑信息)的方式和根据用户历史纠偏数据生成相关信息的方式。

在步骤S602，根据上述样式代码信息，生成待更正对象列表。

将不适配于当前显示界面的样式代码信息作为待更正对象，生成包含一个或多个待更正对象的待更正对象列表。

在步骤S603，根据上述样式代码信息和对应的处理逻辑信息，生成待更正对象与更正逻辑之间的关联关系。

根据本公开的实施例，根据上述样式代码信息和对应的处理逻辑信息，生成待更正对象与更正逻辑之间的关联关系，包括：当上述样式代码信息对应有多个处理逻辑信息时，根据上述样式代码信息所要实现的功能，为每个样式代码信息所对应的多个处理逻辑信息绑定各自对应的功能标识；将上述样式代码信息作为待更正对象，将与上述样式代码信息对应的处理逻辑信息作为更正逻辑，生成与上述功能标识相关的关联关系。

在一实施例中，上述待更正对象包括但不限于是：显示位置设置错误、无效、不合理对应的第一设置参数，对齐相关的第二设置参数、导致内容显示不完整所对应的第三设置参数、浮动设置不合理对应的第四设置参数、多元素布局不合理对应的第五设置参数。上述更正逻辑包括但不限于是：基于预设值替换待更正对象中的参数设置值；对待更正对象中的语法进行更正；将待更正对象中的设置参数转换为符合当前显示界面的语法规范的替代参数，并增补替代参数对应的参数预设值；将待更正对象中的设置参数替换为新参数，增补新参数对应的参数预设值和与上述新参数关联的关联参数信息。

下面示例性描述待更正对象与更正逻辑之间的关联关系。

例如，(a)待更正对象为导致产生内容叠加问题的上外边距(margin)的第一设置代码(对应于显示位置设置错误、不合理)，例如为：“margin-top：-30％”。上述设置在电子书阅读APP中能够实现偏移出页面的效果，不存在显示问题，但是在H5页面中，由于多个章节在一个页面里呈现，会导致内容叠加的问题。与之对应关联的第一更正逻辑为：采用预设值(例如为0)对应的上边距设置值替换该参数设置值。

(b)待更正对象为导致页面产生水平滚动的外边距(margin)和内边距(padding)的第二设置代码(对应于显示位置设置错误、不合理)，与之关联的第二更正逻辑为：把当前显示界面(html)及其主体部分(body)中的水平滚动强制去掉，为了实现整屏宽的效果，替换外边距(margin)和内边距(padding)的值为目标值(例如为0～1em)。

或者，例如，音视频上或音视频容器上写错值，导致过大或过小，解决该问题的更正逻辑为：将视频容器的参数统一设置为：width:100％，音频容器设置为最小宽度为120px。

(c)待更正对象为高度设置参数在当前显示界面失效对应的第三设置代码(对应于显示位置设置无效)。基于epub规范在编写好的文档入库时高度(height)通常是位于body上。在H5页面进行显示时，要将body改成div，并且一个显示页面要放置多个章节，由于对于div语法而言，不会出现多个body并列的语法，因此之前多个章节对应的body中的高度设置参数导致部分无效。有鉴于此，与之对应关联的第三更正逻辑为：将第三设置代码中的设置参数转换为符合当前显示界面语法的设置参数，并对应增补预设的参数值和与所述设置参数关联的预设参数信息，例如为：基于css选择器，采用div.background-img-center对height进行转换，并增补预设的参数值height：177.8vw；min-height：640px；以及增补与设置参数关联的预设参数信息：overflow：hidden；position：relative重置。

(d)待更正对象为限定对齐的参数不完全起作用对应的第四设置代码(对齐相关)，例如第四设置代码为vertical-align:bottom底部对齐这一设置参数；与之关联的第四更正逻辑为：将vertical-align:bottom替换为position:absolute；bottom:xxx(预设参数值)。或者，例如第四设置代码为：××(电子书运营商的简写)-b-l(bottom-left的简写形式)，与之关联的第四更正逻辑为：根据上述样式名补加样式：height:auto；position:absolute；bottom:0；left:0。

(e)待更正对象为导致内容显示不完整对应的第五设置代码(对齐相关)，例如为vertical-align只对行内块级和表格单元格元素起作用；与之关联的第五更正逻辑为：根据对齐这一代码在页面种下的h5_rule_hv钩子，补加样式：height:auto；position:relative；top:50％；-webkit-transform:translate(0,-50％)；transform:translate(0,-50％)；并且在渲染后js(运行在浏览器上的脚本)再检查一遍，如果发现父级比自身高度小的话，去掉垂直居中。

(f)待更正对象为限定对齐的参数不完全起作用对应的第六设置代码(显示完整性相关)，例如有些链接和内容是长串连续字符，会导致撑出屏幕的问题出现；与之关联的第六更正逻辑为：增补以下设置：word-break:break-all。或者，在另一实施例中，目前H5没做画廊轮播，图片是顺序码下来，导致图多的时候，父级不够高图片被截断，解决该问题的更正逻辑为：基于约定的gallery-div(旧的是full-page)做钩子，重置父级高度，让父级自适应图片内容高。在又一实施例中，代码块里内容过长撑开页面，解决该问题的更正逻辑为：设置overflow:auto，让代码块里局部左右滑看。在再一实施例中，已有设置为：width:100％，又加padding或border导致的问题，浏览器默认是往外撑出屏幕，解决该问题的更正逻辑为：设置box-sizing:border-box。或者，再例如，子元素里用到float，导致父级高度显示不正确，解决该问题的更正逻辑为：设置父级overflow:hidden。

以上各个举例仅作为关联关系的示例，实际上在此基础上可以进行拓展或者更改。

图7示意性地示出了根据本公开又一实施例的样式自动纠偏的方法的流程图。

根据本公开的实施例，在上述实施例的基础上，上述样式自动纠偏的方法除了包括上述步骤S201～S203和S501之外，还可以进一步包括以下步骤：S701和S702，并且上述步骤S202在实施时可以包括步骤S202a，步骤S203在实施时可以包括步骤S203a，参照图7所示。

在步骤S701，接收对上述关联关系进行更新的更新信息。

在步骤S702，根据上述更新信息，对上述待更正对象列表和上述关联关系进行更新。

对上述关联关系进行更新包括以下至少一种：对上述关联关系中的待更正对象进行更新、对上述关联关系中的更正逻辑进行更新、对上述待更正对象与上述更正逻辑之间的对应关系进行更新。

其中，上述步骤S202中，根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，包括以下步骤S202a：根据更新后的待更正对象列表，对上述页面信息中的样式信息进行检测。上述步骤S203中，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，包括以下步骤S203a：根据更新后的关联关系，对上述目标对象进行纠偏处理。

通过对关联关系中的待更正对象、更正逻辑或者待更正对象与更正逻辑之间的对应关系进行更新，能够使得不适配检测实现更新，并随着编程语言和显示规范的变动而进行适应性调整，达到在各种类型显示界面正常显示的目的。

本公开的实施例提供的各个技术方案可以全部或部分步骤以硬件实现，或者以在一个或者多个处理器上运行的软件模块实现，或者以它们的组合实现。本领域的技术人员应当理解，可以在实践中使用微处理器或者数字信号处理器(DSP)来实现根据本公开的实施例实施例的电子设备中的一些或者全部部件的一些或者全部功能。本公开的实施例还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序(例如，计算机程序和计算机程序产品)。实现本公开的实施例的程序可以存储在计算机可读介质上，或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到，或者在载体信号上提供，或者以任何其他形式提供。

本公开的第二个示例性实施例提供了一种电子设备。

图8示意性示出了本公开实施例提供的电子设备的结构框图。

参照图8所示，本公开实施例提供的电子设备800包括处理器801、通信接口802、存储器803和通信总线804，其中，处理器801、通信接口802和存储器803通过通信总线804完成相互间的通信；存储器803，用于存放至少一可执行指令；处理器801，用于执行存储器上所存放的可执行指令时，实现如上所述的样式自动纠偏的方法。

具体而言，上述可执行指令使得上述处理器执行以下步骤：获取待显示的页面信息；根据预设的待更正对象列表，对上述页面信息中的样式信息进行检测，确定上述样式信息中是否存在需要进行纠偏的目标对象；当确定上述样式信息中存在上述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对上述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。上述各个步骤的详细实施过程以及还可以进一步包括的步骤可以参照第一实施例的描述，这里不再赘述。

上述待显示的页面信息为采用xhtml编写的电子书文档格式，上述当前显示界面包括：浏览器网页、小程序界面或快应用中加载的H5页面。

根据本公开的实施例，上述电子设备可以是：具有用于进行内容显示(例如为电子书内容)的浏览器、小程序、快应用等的终端设备。或者，上述电子设备可以是为上述内容的显示提供服务支持的服务器，或者是：能够与上述终端设备和/或上述服务器进行通信的服务器集群中的服务器。

上述存储器803可以是诸如闪存、EEPROM(电可擦除可编程只读存储器)、EPROM、硬盘或者ROM之类的电子存储器。存储器803具有用于执行上述方法中的任何方法步骤的可执行指令的存储空间。例如，用于可执行指令的存储空间可以包括分别用于实现上面的方法中的各个步骤的各个可执行指令。这些可执行指令可以从一个或者多个计算机程序产品中读出或者写入到这一个或者多个计算机程序产品中。这些计算机程序产品包括诸如硬盘，光盘(CD)、存储卡或者软盘之类的程序代码载体。这样的计算机程序产品通常为便携式或者固定存储单元。该存储单元可以具有与上述电子设备中的存储器803类似布置的存储段或者存储空间等。可执行指令可以例如以适当形式进行压缩。通常，存储单元包括用于执行根据本公开的实施例的方法操作步骤的可执行指令，即可以由例如诸如801之类的处理器读取的程序代码，这些程序代码当由电子设备运行时，导致该电子设备执行上面所描述的方法中的各个步骤。

本公开的第三个示例性实施例还提供了一种计算机可读存储介质。上述计算机可读存储介质上存储有计算机程序，上述计算机程序被处理器执行时实现如上所述的样式自动纠偏的方法。

该计算机可读存储介质可以是上述实施例中描述的设备/装置中所包含的；也可以是单独存在，而未装配入该设备/装置中。上述计算机可读存储介质承载有一个或者多个程序，当上述一个或者多个程序被执行时，实现根据本公开实施例的方法。

根据本公开的实施例，计算机可读存储介质可以是非易失性的计算机可读存储介质，例如可以包括但不限于：便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

需要说明的是，在本文中，诸如“第一”和“第二”等之类的关系术语仅仅用来将一个实体或者步骤与另一个实体或步骤区分开来，而不一定要求或者暗示这些实体或步骤之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

以上所述仅是本公开的具体实施方式，使本领域技术人员能够理解或实现本公开。对这些实施例的多种修改对本领域的技术人员来说将是显而易见的，本文中所定义的一般原理可以在不脱离本公开的精神或范围的情况下，在其它实施例中实现。因此，本公开将不会被限制于本文所示的这些实施例，而是要符合与本文所申请的原理和新颖特点相一致的最宽的范围。

Claims (10)

1.一种样式自动纠偏的方法，其特征在于，包括：

获取待显示的页面信息；

根据预设的待更正对象列表，对所述页面信息中的样式信息进行检测，确定所述样式信息中是否存在需要进行纠偏的目标对象；

当确定所述样式信息中存在所述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对所述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。

2.根据权利要求1所述的方法，其特征在于，所述根据预设的待更正对象列表，对所述页面信息中的样式信息进行检测，确定所述样式信息中是否存在需要进行纠偏的目标对象，包括：

根据样式信息的标识，定位至所述页面信息中的样式信息；

根据预设的待更正对象列表，检测所述样式信息中是否包含与所述待更正对象列表中的一个或多个待更正对象相匹配的特定代码信息；

当所述样式信息中存在特定代码信息时，确定所述特定代码信息为需要进行纠偏的目标对象。

3.根据权利要求1所述的方法，其特征在于，所述待更正对象与所述预设更正逻辑之间为一对一或一对多的关联关系；

其中，所述根据待更正对象与预设更正逻辑之间的关联关系，对所述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息，包括：

根据待更正对象与预设更正逻辑之间的关联关系，确定所述目标对象对应的一个或多个候选处理逻辑；

当所述目标对象对应的候选处理逻辑为一个时，根据所述候选处理逻辑对所述目标对象进行纠偏处理，得到纠偏后的样式信息，所述纠偏后的样式信息为更正样式信息；

当所述目标对象对应的候选处理逻辑为多个时，根据所述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑中确定与所述目标功能对应的目标处理逻辑；根据所述目标处理逻辑对所述目标对象进行纠偏处理，得到纠偏后的样式信息，所述纠偏后的样式信息为更正样式信息。

4.根据权利要求3所述的方法，其特征在于，针对一对多的关联关系，关联于同一个待更正对象的多个预设更正逻辑绑定有各自对应的功能标识，所述功能标识用于限定当前预设更正逻辑是针对具有特定功能的待更正对象出现的问题而设置的；

其中，所述根据所述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑中确定与所述目标功能对应的目标处理逻辑，包括：

根据所述目标对象所处的语句所限定的目标功能，在多个候选处理逻辑的功能标识或多个候选处理逻辑所对应的关联关系的功能标识中进行匹配；

当存在与所述目标功能匹配的目标功能标识时，确定所述目标功能标识所对应的预设候选处理逻辑为目标处理逻辑。

5.根据权利要求1所述的方法，其特征在于，还包括：生成待更正对象列表和待更正对象与更正逻辑之间的关联关系；

其中，所述生成待更正对象列表和待更正对象与更正逻辑之间的关联关系，包括：

获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息；

根据所述样式代码信息，生成待更正对象列表；

根据所述样式代码信息和对应的处理逻辑信息，生成待更正对象与更正逻辑之间的关联关系。

6.根据权利要求5所述的方法，其特征在于，所述获取不适配于当前显示界面的样式代码信息和对应的处理逻辑信息，包括以下至少一种：

获取用户输入的不适配样式代码的示例信息和针对所述不适配样式代码的处理逻辑信息；或者，

获取用户在调试过程中对已编写好前端样式的代码文档进行纠偏的历史纠偏数据；根据所述历史纠偏数据和调试过程中的界面显示信息，确定不适配于当前显示界面的样式代码信息和对应的处理逻辑信息。

7.根据权利要求5所述的方法，其特征在于，所述根据所述样式代码信息和对应的处理逻辑信息，生成待更正对象与更正逻辑之间的关联关系，包括：

当所述样式代码信息对应有多个处理逻辑信息时，根据所述样式代码信息所要实现的功能，为每个样式代码信息所对应的多个处理逻辑信息绑定各自对应的功能标识；

将所述样式代码信息作为待更正对象，将与所述样式代码信息对应的处理逻辑信息作为更正逻辑，生成与所述功能标识相关的关联关系。

8.根据权利要求5所述的方法，其特征在于，还包括：

接收对所述关联关系进行更新的更新信息；以及

根据所述更新信息，对所述待更正对象列表和所述关联关系进行更新，对所述关联关系进行更新包括以下至少一种：对所述关联关系中的待更正对象进行更新、对所述关联关系中的更正逻辑进行更新、对所述待更正对象与所述更正逻辑之间的对应关系进行更新；

其中，所述根据预设的待更正对象列表，对所述页面信息中的样式信息进行检测，包括：根据更新后的待更正对象列表，对所述页面信息中的样式信息进行检测；

所述根据待更正对象与更正逻辑之间的关联关系，对所述目标对象进行纠偏处理，包括：根据更新后的关联关系，对所述目标对象进行纠偏处理。

9.一种电子设备，其特征在于，包括处理器、通信接口、存储器和通信总线，其中，处理器、通信接口和存储器通过通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使得所述处理器执行以下步骤：

获取待显示的页面信息；

根据预设的待更正对象列表，对所述页面信息中的样式信息进行检测，确定所述样式信息中是否存在需要进行纠偏的目标对象；

当确定所述样式信息中存在所述目标对象时，根据待更正对象与更正逻辑之间的关联关系，对所述目标对象进行纠偏处理，得到适配于当前显示界面的更正样式信息。

10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-8中任一项所述的方法。

Images