掌桥专利:专业的专利平台
掌桥专利
首页

网页自适应方法及相关产品

文献发布时间:2023-06-19 09:58:59


网页自适应方法及相关产品

技术领域

本申请涉及电子设备技术领域,具体涉及一种网页自适应方法及相关产品。

背景技术

网页中常会布置多种网页元素,如图片、视频、文本等,网页元素本身会随着网页的缩放按照相同的网页显示比例进行缩放,缩放过程即为网页的自适应;但当网页元素具有某种特定属性,如边框时,则该网页元素的边框无法一直随着网页的缩放按照相同的网页显示比例进行缩放,网页元素某些属性在缩放到一定程度后将无法再被缩放,例如图片边框。目前网页自适应的适配方式主要是使用百分比,当网页缩放时,由于按照网页显示比例缩放,而边框不再随网页缩放而缩放,这就使得不再缩放的边框所在的行需要的父容器宽度大于该父容器的实际宽度,这种情况下,该行最右侧的网页元素会移动到下一行中。这就造成了网页布局的变化,使得网页无法正常显示,因此该适配方式不能使用具有绝对宽度的元素。

网页的自适应在管理系统中占有非常重要的地位,它能够给用户提供良好的视觉体验和操作体验。目前市面上的网页自适应方案,无法照顾到更多用户的爱好及使用习惯。

发明内容

本申请实施例提供了一种网页自适应方法及相关产品,以期提高网页自适应的高效性和便捷性。

第一方面,本申请实施例提供一种网页自适应方法,所述方法包括:

获取屏幕当前显示的屏幕信息;

获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性;

根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容。

第二方面,本申请实施例提供一种网页自适应装置,所述网页自适应装置包括处理单元、通信单元和存储单元,其中,

所述处理单元,用于获取屏幕当前显示的屏幕信息;以及用于获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性;以及用于根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容。

第三方面,本申请实施例提供一种电子设备,包括处理器、存储器、通信接口以及一个或多个程序,其中,上述一个或多个程序被存储在上述存储器中,并且被配置由上述处理器执行,上述程序包括用于执行本申请实施例第一方面任一方法中的步骤的指令。

第四方面,本申请实施例提供了一种计算机可读存储介质,其中,上述计算机可读存储介质存储用于电子数据交换的计算机程序,其中,上述计算机程序使得计算机执行如本申请实施例第二方面任一方法中所描述的部分或全部步骤。

第五方面,本申请实施例提供了一种计算机程序产品,其中,上述计算机程序产品包括存储了计算机程序的非瞬时性计算机可读存储介质,上述计算机程序可操作来使计算机执行如本申请实施例第二方面任一方法中所描述的部分或全部步骤。该计算机程序产品可以为一个软件安装包。

可以看出,本申请实施例中,提供了一种网页自适应方法及相关产品,所述方法包括:电子设备获取屏幕当前显示的屏幕信息;所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性,接着所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,然后对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容;可见,通过上述方法,在进行网页自适应的过程中可以根据不同元素模块的模块特征来选择合适的自适应方法,同时上述方法中包括多模式的网页自适应方案,有利于满足用户使用过程中多样化的网页自适应需求,有利于降低网页自适应的开发成本,从而有利于提高网页自适应的高效性和便捷性。

附图说明

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

图1A是本申请实施例提供的一种网页自适应方法的流程示意图;

图1B是本申请实施例提供的一种网页自适应方法的场景示意图;

图2是本申请实施例提供的另一种网页自适应方法的流程示意图;

图3是本申请实施例提供的另一种网页自适应方法的流程示意图;

图4是本申请实施例提供的一种电子设备的结构示意图;

图5是本申请实施例提供的一种网页自适应装置的功能单元组成框图。

具体实施方式

为了使本技术领域的人员更好地理解本申请方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。

本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别不同对象,而不是用于描述特定顺序。此外,术语“包括”和“具有”以及它们任何变形,意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元,而是可选地还包括没有列出的步骤或单元,或可选地还包括对于这些过程、方法、产品或设备固有的其他步骤或单元。

在本文中提及“实施例”意味着,结合实施例描述的特定特征、结构或特性可以包含在本申请的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例,也不是与其它实施例互斥的独立的或备选的实施例。本领域技术人员显式地和隐式地理解的是,本文所描述的实施例可以与其它实施例相结合。

下面对本申请实施例进行详细介绍。

请参阅图1A,图1A是本申请实施例提供了一种网页自适应方法的流程示意图,所述方法包括:

S101,电子设备获取屏幕当前显示的屏幕信息;

其中,所述屏幕信息包括屏幕尺寸和屏幕分辨率。

其中,所述获取屏幕当前显示的屏幕信息还包括电子设备接收到用户选择显示其他尺寸的请求,根据所述请求调整屏幕信息。

S102,所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征;

其中,所述元素模块包括至少一个元素,每个所述元素对应一个元素属性。

其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性。

其中,所述模块特征包括重复性特征和独立性特征。

其中,所述重复性特征包括格式一致的字符、尺寸一致的图片等。

其中,所述独立性特征包括独特的字符、图片,搜索框等。

S103,所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容。

其中,所述自适应调整包括基于百分比模式对每个所述元素进行尺寸渲染。

可以看出,本申请实施例中,提供了一种网页自适应方法及相关产品,所述方法包括:电子设备获取屏幕当前显示的屏幕信息;所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性,接着所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,然后对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容;可见,通过上述方法,在进行网页自适应的过程中可以根据不同元素模块的模块特征来选择合适的自适应方法,同时上述方法中包括多模式的网页自适应方案,有利于满足用户使用过程中多样化的网页自适应需求,有利于降低网页自适应的开发成本,从而有利于提高网页自适应的高效性和便捷性。

在一个可能的示例中,所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,包括:电子设备获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置;所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块;所述电子设备根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征。

其中,所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块包括根据所述元素位置,确定位于第一区域的所述元素为第一元素模块、位于第二区域的所述元素为第二元素模块。

具体地,所述确定所述每个元素模块对应的模块特征包括第一元素模块中包括位于第一区域的元素J、元素K和元素L,元素J、元素K和元素L的元素属性相同,则确定所述第一元素模块的模块特征为重复性特征。

具体实现中,电子设备获取待显示的第一页面内容中的每个元素Z1、Z2、Z3和Z4,以及每个所述元素对应的元素位置P1、P2、P3和P4;所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定元素Z1和元素Z2对应的元素模块为模块1,元素Z3和元素Z4对应的元素模块为模块2;所述电子设备根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述模块1对应的模块特征为重复性特征,所述模块2对应的模块特征为独立性特征。

可见,本示例中,电子设备获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置,接着所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块,最后所述电子设备再根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征;通过元素位置确定相对应元素所属的模块,再根据模块中元素的元素属性确定模块特征,有利于提高模块划分的准确性,进而有利于提高网页自适应过程的准确性和便捷性。

在一个可能的示例中,所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,包括:电子设备确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸;所述电子设备获取所述屏幕信息中的屏幕尺寸和所述元素模块中的静态元素尺寸;所述电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸;所述电子设备根据所述静态元素尺寸和所述动态元素尺寸确定至少一个目标模块;所述电子设备根据所述目标模块显示调整后的所述第一页面内容。

其中,所述第一预设尺寸包括所述元素模块在所述待显示的第一页面内容中的尺寸。

其中,所述静态元素尺寸包括所述元素模块中固定部分的元素尺寸,如文字、图片。

其中,所述动态元素尺寸包括所述元素模块中可变部分的元素尺寸,如空白部分的尺寸、搜索框的尺寸。

具体实现中,如图1B所示,电子设备确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸,静态元素包括“险种选择”、“投保状态”、“建议书制作时间”和“架构范围”,所述电子设备获取所述屏幕信息中的屏幕尺寸,以及所述元素模块中的静态元素尺寸,所述电子设备根据所述屏幕尺寸和所述第一预设尺寸,计算不同尺寸对应的全屏百分比:

根据上述方法,以一个文字占宽20px为例:

从而定义动态元素尺寸:

所述电子设备根据所述静态元素尺寸和所述动态元素尺寸,可确定目标模块:所述电子设备根据所述目标模块显示调整后的所述第一页面内容。。

可见,本示例中,电子设备确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸,所述电子设备获取所述屏幕信息中的屏幕尺寸和所述元素模块中的静态元素尺寸,接着所述电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸,所述电子设备根据所述静态元素尺寸和所述动态元素尺寸确定至少一个目标模块,所述电子设备根据所述目标模块显示调整后的所述第一页面内容;通过上述方法,多个元素模块可以共用一套通用的设计模板,有利于在满足多样化的自适应要求的同时节省开发人力物力,有利于提高网页自适应的便捷性。

在一个可能的示例中,所述电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸,包括:电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定全屏百分比;所述电子设备根据所述全屏百分比和所述静态元素尺寸,确定所述元素模块对应的百分比定义类;所述电子设备根据所述百分比定义类调节确定每个所述元素模块中的动态元素尺寸。

其中,所述根据所述百分比定义类调节确定每个所述元素模块中的动态元素尺寸包括根据不同的百分比可以得到不同的动态元素尺寸。

其中,所述动态元素尺寸与所述静态元素尺寸相关,所述静态元素尺寸越大,所述动态元素尺寸则越小。

具体实现中,电子设备根据所述屏幕尺寸E和所述第一预设尺寸F,确定全屏百分比,接着所述电子设备根据所述全屏百分比和所述静态元素尺寸f1,确定所述元素模块对应的百分比定义类,所述电子设备根据所述百分比定义类调节确定每个所述元素模块中的动态元素尺寸f2。

可见,本示例中,电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定全屏百分比,所述电子设备根据所述全屏百分比和所述静态元素尺寸,确定所述元素模块对应的百分比定义类,所述电子设备根据所述百分比定义类调节确定每个所述元素模块中的动态元素尺寸;调节不同网页自适应模式中各元素的显示效果,有利于提高网页自适应的高效性。

在一个可能的示例中,所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,包括:电子设备确定所述模块特征包括独立性特征,获取到所述元素模块对应的预设模块尺寸包括第二预设尺寸和第三预设尺寸;所述电子设备获取所述屏幕信息中的屏幕尺寸;所述电子设备根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比;所述电子设备根据所述常规百分比和所述至少一个元素模块中每个元素模块对应的预设模块尺寸,确定目标模块;所述电子设备根据所述目标模块显示调整后的所述第一页面内容。

其中,所述获取到所述元素模块对应的预设模块尺寸包括第二预设尺寸和第三预设尺寸包括所述元素模块一对应的预设模块尺寸为第二预设模块尺寸,元素模块二对应的预设模块尺寸为第三预设尺寸。

其中,所述第二预设尺寸和第三预设尺寸均小于所述屏幕尺寸。

具体实现中,电子设备确定所述模块特征包括独立性特征,获取到所述元素模块对应的预设模块尺寸包括元素模块L1对应的第二预设尺寸r1和元素模块L2对应的第三预设尺寸r2;所述电子设备获取所述屏幕信息中的屏幕尺寸;所述电子设备根据所述屏幕尺寸r0、所述第二预设尺寸r1和所述第三预设尺寸r2,确定常规百分比,接着根据所述常规百分比和所述至少一个元素模块中每个元素模块对应的预设模块尺寸,确定目标模块,最后所述电子设备根据所述目标模块显示调整后的所述第一页面内容。

可见,本示例中,电子设备确定所述模块特征包括独立性特征,获取到所述元素模块对应的预设模块尺寸包括第二预设尺寸和第三预设尺寸,所述电子设备获取所述屏幕信息中的屏幕尺寸,接着所述电子设备根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比,然后所述电子设备根据所述常规百分比和所述至少一个元素模块中每个元素模块对应的预设模块尺寸,确定目标模块,最后所述电子设备根据所述目标模块显示调整后的所述第一页面内容;通过上述方法,有利于提高网页自适应的准确性。

在一个可能的示例中,所述电子设备根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比,包括:电子设备确定所述第二预设尺寸与所述屏幕尺寸的第一百分比;所述电子设备根据所述第一百分比和所述第三预设尺寸确定第三目标尺寸;所述电子设备若检测到所述第三目标尺寸满足第一预设阈值,则确定所述第一百分比为常规百分比。

其中,所述第一预设阈值包括所述第三目标尺寸与所述第二预设尺寸之和小于或等于所述屏幕尺寸。

具体实现中,电子设备确定所述第二预设尺寸H2与所述屏幕尺寸H1的第一百分比40%,所述电子设备根据所述第一百分比40%和所述第三预设尺寸H3确定第三目标尺寸J3;所述电子设备若检测到所述第三目标尺寸J3小于H,确定所述第一百分比40%为常规百分比。

可见,本示例中,电子设备确定所述第二预设尺寸与所述屏幕尺寸的第一百分比;所述电子设备根据所述第一百分比和所述第三预设尺寸确定第三目标尺寸;所述电子设备若检测到所述第三目标尺寸满足第一预设阈值,则确定所述第一百分比为常规百分比;有利于提高网页自适应的准确性。

在一个可能的示例中,所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,包括:电子设备确定所述模块特征包括重复性特征和独立性特征;所述电子设备通过所述待显示的第一页面内容中的脚本语言和网页修饰样式表,确定所述至少一个元素模块中每个所述元素模块的第一边长;所述电子设备根据所述第一边长,确定每个所述元素模块的第二边长;所述电子设备根据所述第一边长和所述第二边长确定目标模块;所述电子设备根据所述目标模块显示调整后的所述第一页面内容。

具体实现中,电子设备确定元素模块K1的模块特征包括重复性特征,元素模块K2的模块特征包括独立性特征,所述电子设备通过所述待显示的第一页面内容中的脚本语言和网页修饰样式表,确定K1的第一边长a1和K2的第一边长a2,所述电子设备根据a1和a2,确定K1的第二边长b1和K2的第二边长b2,接着所述电子设备根据所述第一边长和所述第二边长确定目标模块,所述电子设备根据所述目标模块显示调整后的所述第一页面内容。

可见,本示例中,电子设备确定所述模块特征包括重复性特征和独立性特征,接着所述电子设备通过所述待显示的第一页面内容中的脚本语言和网页修饰样式表,确定所述至少一个元素模块中每个所述元素模块的第一边长,所述电子设备根据所述第一边长,确定每个所述元素模块的第二边长,所述电子设备根据所述第一边长和所述第二边长确定目标模块,所述电子设备根据所述目标模块显示调整后的所述第一页面内容;通过上述方法,在待显示页面存在多种模块特征时对不同元素模块进行不同的尺寸渲染,有利于提高页面效果的统一性,有利于提高网页自适应的高效性。

与上述图1A所示的实施例一致的,请参阅图2,图2是本申请实施例提供的另一种网页自适应方法的流程示意图;如图所示,本网页自适应方法包括:

S201,电子设备获取屏幕当前显示的屏幕信息;

S202,所述电子设备获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置;

S203,所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块;

S204,所述电子设备根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征;

S205,所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容。

可以看出,本申请实施例中,提供了一种网页自适应方法及相关产品,所述方法包括:电子设备获取屏幕当前显示的屏幕信息;所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性,接着所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,然后对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容;可见,通过上述方法,在进行网页自适应的过程中可以根据不同元素模块的模块特征来选择合适的自适应方法,同时上述方法中包括多模式的网页自适应方案,有利于满足用户使用过程中多样化的网页自适应需求,有利于降低网页自适应的开发成本,从而有利于提高网页自适应的高效性和便捷性。

此外,电子设备获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置,接着所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块,最后所述电子设备再根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征;通过元素位置确定相对应元素所属的模块,再根据模块中元素的元素属性确定模块特征,有利于提高模块划分的准确性,进而有利于提高网页自适应过程的准确性和便捷性。

与上述图1A所示的实施例一致的,请参阅图3,图3是本申请实施例提供的另一种网页自适应方法的流程示意图;如图所示,本网页自适应方法包括:

S301,电子设备获取屏幕当前显示的屏幕信息;

S302,所述电子设备获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置;

S303,所述电子设备根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块;

S304,所述电子设备根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征;

S305,所述电子设备确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸;

S306,所述电子设备获取所述屏幕信息中的屏幕尺寸和所述元素模块中的静态元素尺寸;

S307,所述电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸;

S308,所述电子设备根据所述静态元素尺寸和所述动态元素尺寸确定至少一个目标模块;

S309,所述电子设备根据所述目标模块显示调整后的所述第一页面内容。

可以看出,本申请实施例中,提供了一种网页自适应方法及相关产品,所述方法包括:电子设备获取屏幕当前显示的屏幕信息;所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性,接着所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,然后对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容;可见,通过上述方法,在进行网页自适应的过程中可以根据不同元素模块的模块特征来选择合适的自适应方法,同时上述方法中包括多模式的网页自适应方案,有利于满足用户使用过程中多样化的网页自适应需求,有利于降低网页自适应的开发成本,从而有利于提高网页自适应的高效性和便捷性。

此外,电子设备确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸,所述电子设备获取所述屏幕信息中的屏幕尺寸和所述元素模块中的静态元素尺寸,接着所述电子设备根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸,所述电子设备根据所述静态元素尺寸和所述动态元素尺寸确定至少一个目标模块,所述电子设备根据所述目标模块显示调整后的所述第一页面内容;通过上述方法,多个元素模块可以共用一套通用的设计模板,有利于在满足多样化的自适应要求的同时节省开发人力物力,有利于提高网页自适应的便捷性。

与上述图1A、图2、图3所示的实施例一致的,请参阅图4,图4是本申请实施例提供的一种电子设备400的结构示意图,如图所示,所述电子设备400包括应用处理器410、存储器420、通信接口430以及一个或多个程序421,其中,所述一个或多个程序421被存储在上述存储器420中,并且被配置由上述应用处理器410执行,所述一个或多个程序421包括用于执行以下步骤的指令;

获取屏幕当前显示的屏幕信息;

获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性;

根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容。

可以看出,本申请实施例中,提供了一种网页自适应方法及相关产品,所述方法包括:电子设备获取屏幕当前显示的屏幕信息;所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性,接着所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,然后对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容;可见,通过上述方法,在进行网页自适应的过程中可以根据不同元素模块的模块特征来选择合适的自适应方法,同时上述方法中包括多模式的网页自适应方案,有利于满足用户使用过程中多样化的网页自适应需求,有利于降低网页自适应的开发成本,从而有利于提高网页自适应的高效性和便捷性。

在一个可能的示例中,所述获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,所述程序中的指令具体用于执行以下操作:获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置;根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块;根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征。

在一个可能的示例中,所述根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,所述程序中的指令具体用于执行以下操作:确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸;获取所述屏幕信息中的屏幕尺寸和所述元素模块中的静态元素尺寸;根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸;根据所述静态元素尺寸和所述动态元素尺寸确定至少一个目标模块;根据所述目标模块显示调整后的所述第一页面内容。

在一个可能的示例中,所述根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸,所述程序中的指令具体用于执行以下操作:根据所述屏幕尺寸和所述第一预设尺寸,确定全屏百分比;根据所述全屏百分比和所述静态元素尺寸,确定所述元素模块对应的百分比定义类;根据所述百分比定义类调节确定每个所述元素模块中的动态元素尺寸。

在一个可能的示例中,所述根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,所述程序中的指令具体用于执行以下操作:确定所述模块特征包括独立性特征,获取到所述元素模块对应的预设模块尺寸包括第二预设尺寸和第三预设尺寸;获取所述屏幕信息中的屏幕尺寸;根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比;根据所述常规百分比和所述至少一个元素模块中每个元素模块对应的预设模块尺寸,确定目标模块;根据所述目标模块显示调整后的所述第一页面内容。

在一个可能的示例中,所述根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比,所述程序中的指令具体用于执行以下操作:确定所述第二预设尺寸与所述屏幕尺寸的第一百分比;根据所述第一百分比和所述第三预设尺寸确定第三目标尺寸;若检测到所述第三目标尺寸满足第一预设阈值,则确定所述第一百分比为常规百分比,其中,所述第一预设阈值包括所述第三目标尺寸与所述第二预设尺寸之和小于或等于所述屏幕尺寸。

在一个可能的示例中,所述根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,方法还所述程序中的指令具体用于执行以下操作:确定所述模块特征包括重复性特征和独立性特征;通过所述待显示的第一页面内容中的脚本语言和网页修饰样式表,确定所述至少一个元素模块中每个所述元素模块的第一边长;根据所述第一边长,确定每个所述元素模块的第二边长;根据所述第一边长和所述第二边长确定目标模块;根据所述目标模块显示调整后的所述第一页面内容。

上述主要从方法侧执行过程的角度对本申请实施例的方案进行了介绍。可以理解的是,电子设备为了实现上述功能,其包含了执行各个功能相应的硬件结构和/或软件模块。本领域技术人员应该很容易意识到,结合本文中所提供的实施例描述的各示例的单元及算法步骤,本申请能够以硬件或硬件和计算机软件的结合形式来实现。某个功能究竟以硬件还是计算机软件驱动硬件的方式来执行,取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用使用不同方法来实现所描述的功能,但是这种实现不应认为超出本申请的范围。

本申请实施例可以根据上述方法示例对电子设备进行功能单元的划分,例如,可以对应各个功能划分各个功能单元,也可以将两个或两个以上的功能集成在一个处理单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。需要说明的是,本申请实施例中对单元的划分是示意性的,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式。

图5是本申请实施例中所涉及的网页自适应装置500的功能单元组成框图。该网页自适应装置500应用于电子设备,包括处理单元501、通信单元502和存储单元503,其中,

所述处理单元501,用于获取屏幕当前显示的屏幕信息;以及用于获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性;以及用于根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容。

可以看出,本申请实施例中,提供了一种网页自适应方法及相关产品,所述方法包括:电子设备获取屏幕当前显示的屏幕信息;所述电子设备获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,其中,所述模块特征包括用于表示当前模块的元素属性与其他模块的元素属性之间是否存在重复性,接着所述电子设备根据所述屏幕信息和所述每个元素模块的模块特征,然后对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容;可见,通过上述方法,在进行网页自适应的过程中可以根据不同元素模块的模块特征来选择合适的自适应方法,同时上述方法中包括多模式的网页自适应方案,有利于满足用户使用过程中多样化的网页自适应需求,有利于降低网页自适应的开发成本,从而有利于提高网页自适应的高效性和便捷性。

可以理解的是,由于方法实施例与装置实施例为相同技术构思的不同呈现形式,因此,本申请中方法实施例部分的内容应同步适配于装置实施例部分,此处不再赘述。

在一个可能的示例中,所述获取待显示的第一页面内容中的至少一个元素模块,并确定所述至少一个元素模块中每个元素模块的模块特征,所述处理单元501具体用于:获取待显示的第一页面内容中的每个元素,以及每个所述元素对应的元素位置;根据所述元素位置,对每个所述元素进行识别分类,确定每个所述元素对应的元素模块;根据所述元素模块中包含的每个所述元素对应的元素属性,确定所述每个元素模块对应的模块特征。

在一个可能的示例中,所述根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,所述处理单元501具体用于:确定所述模块特征包括重复性特征,获取所述元素模块的预设模块尺寸为第一预设尺寸;获取所述屏幕信息中的屏幕尺寸和所述元素模块中的静态元素尺寸;根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸;根据所述静态元素尺寸和所述动态元素尺寸确定至少一个目标模块;根据所述目标模块显示调整后的所述第一页面内容。

在一个可能的示例中,所述根据所述屏幕尺寸和所述第一预设尺寸,确定动态元素尺寸,所述处理单元501具体用于:根据所述屏幕尺寸和所述第一预设尺寸,确定全屏百分比;根据所述全屏百分比和所述静态元素尺寸,确定所述元素模块对应的百分比定义类;根据所述百分比定义类调节确定每个所述元素模块中的动态元素尺寸。

在一个可能的示例中,所述根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,所述处理单元501具体用于:确定所述模块特征包括独立性特征,获取到所述元素模块对应的预设模块尺寸包括第二预设尺寸和第三预设尺寸;获取所述屏幕信息中的屏幕尺寸;根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比;根据所述常规百分比和所述至少一个元素模块中每个元素模块对应的预设模块尺寸,确定目标模块;根据所述目标模块显示调整后的所述第一页面内容。

在一个可能的示例中,所述根据所述屏幕尺寸、所述第二预设尺寸和所述第三预设尺寸,确定常规百分比,所述处理单元501具体用于:确定所述第二预设尺寸与所述屏幕尺寸的第一百分比;根据所述第一百分比和所述第三预设尺寸确定第三目标尺寸;若检测到所述第三目标尺寸满足第一预设阈值,则确定所述第一百分比为常规百分比,其中,所述第一预设阈值包括所述第三目标尺寸与所述第二预设尺寸之和小于或等于所述屏幕尺寸。

在一个可能的示例中,所述根据所述屏幕信息和所述每个元素模块的模块特征,对所述第一页面内容进行自适应调整,并显示调整后的所述第一页面内容,方法还所述处理单元501具体用于:确定所述模块特征包括重复性特征和独立性特征;通过所述待显示的第一页面内容中的脚本语言和网页修饰样式表,确定所述至少一个元素模块中每个所述元素模块的第一边长;根据所述第一边长,确定每个所述元素模块的第二边长;根据所述第一边长和所述第二边长确定目标模块;根据所述目标模块显示调整后的所述第一页面内容。

本申请实施例还提供一种计算机存储介质,其中,该计算机存储介质存储用于电子数据交换的计算机程序,该计算机程序使得计算机执行如上述方法实施例中记载的任一方法的部分或全部步骤,上述计算机包括电子设备。

本申请实施例还提供一种计算机程序产品,上述计算机程序产品包括存储了计算机程序的非瞬时性计算机可读存储介质,上述计算机程序可操作来使计算机执行如上述方法实施例中记载的任一方法的部分或全部步骤。该计算机程序产品可以为一个软件安装包,上述计算机包括电子设备。

需要说明的是,对于前述的各方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本申请并不受所描述的动作顺序的限制,因为依据本申请,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作和模块并不一定是本申请所必须的。

在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。

在本申请所提供的几个实施例中,应该理解到,所揭露的装置,可通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如上述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性或其它的形式。

上述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。

上述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储器中。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储器中,包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本申请各个实施例上述方法的全部或部分步骤。而前述的存储器包括:U盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。

本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成,该程序可以存储于一计算机可读存储器中,存储器可以包括:闪存盘、只读存储器(英文:Read-Only Memory,简称:ROM)、随机存取器(英文:Random Access Memory,简称:RAM)、磁盘或光盘等。

以上对本申请实施例进行了详细介绍,本文中应用了具体个例对本申请的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本申请的方法及其核心思想;同时,对于本领域的一般技术人员,依据本申请的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本申请的限制。

相关技术
  • 网页自适应方法及相关产品
  • 一种针对客户端环境的网页代码自适应方法
技术分类

06120112376193