WO2019200797A1 - 页面数字显示方法、装置、计算机设备及存储介质 - Google Patents

页面数字显示方法、装置、计算机设备及存储介质 Download PDF

Info

Publication number
WO2019200797A1
WO2019200797A1 PCT/CN2018/101842 CN2018101842W WO2019200797A1 WO 2019200797 A1 WO2019200797 A1 WO 2019200797A1 CN 2018101842 W CN2018101842 W CN 2018101842W WO 2019200797 A1 WO2019200797 A1 WO 2019200797A1
Authority
WO
WIPO (PCT)
Prior art keywords
page
digital picture
decimal point
displayed
html
Prior art date
Application number
PCT/CN2018/101842
Other languages
English (en)
French (fr)
Inventor
方小伟
Original Assignee
平安科技(深圳)有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 平安科技(深圳)有限公司 filed Critical 平安科技(深圳)有限公司
Publication of WO2019200797A1 publication Critical patent/WO2019200797A1/zh

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation

Abstract

本申请提供了一种页面数字显示方法、装置、计算机设备及存储介质,每一个需要显示的数字对应一个HTML标签,0-9的特殊字体的数字被制作成一张数字图片,通过确定HTML标签中的数字在数字图片中的位置坐标来加载数字图片中的该数字,从而将数字显示在页面上。本申请将数字的文字资源由字体文件变为一张数字图片,减少了页面的大小,针对页面需要显示的一个数字只需生成对应的一个HTML标签,进一步降低页面的大小,程序运行效率高,数字显示不卡顿。

Description

页面数字显示方法、装置、计算机设备及存储介质
本申请要求于2018年04月20日提交中国专利局、申请号为201810361312.3、申请名称为“页面数字显示方法、装置、计算机设备及存储介质”的中国专利申请的优先权,其全部内容通过引用结合在本申请中。
技术领域
本申请涉及信息处理技术领域,尤其涉及一种页面数字显示方法、装置、计算机设备及存储介质。
背景技术
数字在网页页面的显示具有一定的机制,显示在页面的数字不是突然变化的,而是从0开始滚动至需要显示的数字后停止,最终页面显示停止的数字。
目前在页面上显示数字的方法是通过js程序生成数字0-9的HTML标签,用于显示的数字为文字格式而非图片格式,导致以下缺陷:1.不管需要显示的数字为几位,都需要生成包含0到9数字的HTML标签,这增加了生成的页面DOM(Document Object Model,文档对象模型)节点,导致页面运行效率降低;2.如果页面上需要显示的数字为特殊字体,则还需要加载该特殊字体的字体包文件,这会增大页面总大小,导致运行效率降低,甚至造成页面卡顿。
发明内容
本申请实施例提供了一种页面数字显示方法、装置、计算机设备及存储介质,能够快速地在页面上显示特殊字体的数字。
第一方面,本申请实施例提供了一种页面数字显示方法,该方法包括:
预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;
加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从 所述HTML标签中获取所述数字的样式名;
根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;
读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
第二方面,本申请实施例还提供了一种页面数字显示装置,所述页面数字显示装置包括用于实现第一方面所述的页面数字显示方法的单元。
第三方面,本申请实施例还提供了一种计算机设备,包括存储器,以及与所述存储器相连的处理器;
所述存储器用于存储实现页面数字显示方法的计算机程序;
所述处理器用于运行所述存储器中存储的计算机程序,以执行如上述第一方面所述的方法。
第四方面,本申请实施例提供了一种存储介质,所述存储介质存储有一个或者一个以上计算机程序,所述一个或者一个以上计算机程序可被一个或者一个以上的处理器执行,以实现上述第一方面所述的方法。
本申请实施例提供了页面数字显示方法、装置、计算机设备及存储介质,每一个需要显示的数字对应一个HTML标签,0-9的特殊字体的数字被制作成一张数字图片,通过确定HTML标签中的数字在数字图片中的位置坐标来加载数字图片中的该数字,从而将数字显示在页面上。本申请实施例将数字的文字资源由字体文件变为一张数字图片,减少了页面的大小,针对页面需要显示的一个数字只需生成对应的一个HTML标签,进一步降低页面的大小,程序运行效率高,数字显示不卡顿。
附图说明
为了更清楚地说明本申请实施例技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本申请实施例提供的一种页面数字显示方法的流程示意图;
图2是本申请实施例提供的数字图片的示意图;
图3是本申请实施例提供的数字图片的另一示意图;
图4是本申请实施例提供的一种页面数字显示方法的子流程示意图;
图5是本申请实施例提供的一种页面数字显示装置的示意性框图;
图6是本申请实施例提供的一种页面数字显示装置的子单元示意性框图;
图7是本申请实施例提供的一种计算机设备的结构示意性框图。
具体实施方式
下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。
应当理解,当在本说明书和所附权利要求书中使用时,术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在,但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。
还应当理解,在本申请说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合,并且包括这些组合。
也应当理解,尽管术语第一、第二等可以在此用来描述各种元素,但这些元素不应该受限于这些术语,这些术语仅用来将这些元素彼此区分开。
图1为本申请实施例提供的一种页面数字显示方法的流程示意图。该方法包括步骤S101~S104。
S101,预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字。
加载页面显示的内容是通过页面的HTML文件来确定的,通过该HTML文件可以获取整个页面的内容,因此,若需要在页面展示数字,则需要在HTML文件中用HTML标签来表示数字。CSS(Cascading Style Sheets,层叠样式表)文件用来表现HTML文件,控制HTML中的内容表现在页面上。
在一些实施例中,例如本申请实施例中,将阿拉伯数字0-9按预设方向依序排列,例如从上到下排列,使得每个数字的横坐标相同,如此在后续读取数字时保持横坐标不变沿纵向方向读取即可。将排列好的0-9数字制作成一张数字图片,如图2所示,这样所有需要用到的数字都做到了同一张数字图片上,不同的数字在数字图片中不同的位置。而对于需要显示在页面上的数字或数,针对一位数字只需要设计一个HTML标签,在该HTML标签中添加数字的样式名,再通过CSS文件确定该样式名的样式属性,在CSS文件中用数字图片中的位置坐标表示数字的样式属性。
在一实施例中,0-9数字的字体均为Times New Roman,在其他实施例中,0-9数字的字体可以根据所需的字体进行改变。
因作图时每个数字的排放位置会有细微的差异,因此CSS文件中设置的具体的样式属性可以根据实际效果做微调。
S102,加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名。
加载页面内容的过程具体为加载HTML文件的过程,当加载HTML文件中的数字的HTML标签时,获取该标签中的样式名,该标签的样式名指明需要显示的数字为哪一个。
S103,根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标。
获取HTML标签中的样式名后,需要从CSS文件中找到该样式名的样式属性,该样式属性指明数据的来源,最终根据这个属性样式找到需要显示的数字的样式。
S104,读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
样式属性指明了需要显示的内容(即数字)在所述数字图片中的具体位置,最终读取该数据图片中对应位置的数字,将这个数字显示在页面上。
在本申请实施例中,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用于表示坐标点位于数字图片纵向方向的比例位置。位置坐标用数字在数字图片中的相对位置来表示而不用的绝对单位像素表示,因此数字在不同像素不同尺寸的屏幕上显示时都能兼容,不会出现数字排版错乱或显示错乱的情况。
以数字8为例,在HTML文件中添加一个标签<em></em>,在标签 <em></em>添加数字8的样式名(即class),得到数字8的HTML标签如下:
<em class=″num-8″></em>。
class=″num-8″定义数字8的样式名为″num-8″,在css文件中写入样式名″num-8″的样式属性:.num-8.scrollNum.num-8{background-position:0 91.1%;},background-position:0 91.1%即表示数字8的中心在数字图片中的位置坐标为(0,91.1%)。如图2所示,以数字0所在的位置为数字图片的起点位置,(0,91.1%)表示数字图片中8的横坐标为0,纵坐标在数字图片纵向的91.1%处的位置。
以上是显示单个数字的实施例,利用同样的原理可以显示小数。
在其他实施例中,所述需要显示在页面的数据为小数;所述页面HTML文件还包括小数点的HTML标签;所述CSS文件还包括所述小数点的样式属性;所述数字图片的内容还包括小数点,如图3所示,小数点与0-9的数字按从上到下的方向依次排列。
在该其他实施例中,步骤S102具体为:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名。
在该其他实施例中,步骤S103具体为:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标。
在该其他实施例中,如图4所示,所述步骤S104包括子步骤S1041-S1042:
S1041,在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点。
S1042,将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
对于需要显示的小数,在加载数据时并不是一次性加载所有小数中的数字和小数点后再将小数完整显示在页面上,而是一位一位数逐一加载到页面上显示,即先获取高位数的HTML标签中的样式名、CSS文件中的样式属性,从数字图片中读取该高位数后显示在页面上,然后按照同样的方法加载下一位数字或小数点,将每次加载到的数字或小数点显示在上一个数字的右面下一相邻的位置,致使该小数的高位数至低位数(包括小数点)逐一显示出来。
虽然小数是从高位数至低位数(包括小数点)逐一显示出来的,但实际上由于服务器的处理效率非常高,显示每位数字的时间差非常短,人眼无法分辨, 因此人眼观察到的小数是完整显示的而并非每位数字逐一显示。
在一些实施例中,所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
在制作数字图片时使得每位数字以及小数点所占据的位置大小一致,例如纵向方向占的位置均为9.09%(100%÷11≈9.09%),因小数点以及数字从上至下排列,因此其在横向方向占的位置可自由设置,预设比例的所述数字图片面积指的是数字或小数点在纵向方向占据的数字图片的纵向长度的比例,例如为9.09%。
在一些实施例中,步骤S104具体为:从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
由于每位数字以及小数点的横坐标相同,在沿预设方向(从上到下)读取数字图片的内容时只需考虑移动的纵向位置比例,即每次向下移动9.09%的距离读取下一位数字。
读取预设比例的数字图片面积内的内容指的是读取以位置坐标为中心的纵向长度比例为9.09%范围内的内容,如图3所示,一开始从起点(即小数点的中心)开始读取内容,首先读取到的是小数点,然后向下移动9.09%的距离,读取9.09%处的数字0,以此类推一直读取到该样式属性即位置坐标处的数字。
每次读取到一项内容后都将该内容显示在页面上,在下次读取到内容后将该下次的内容覆盖当前的内容显示在页面时,因此数字的显示形成了数字滚动的效果。但实际上,因为服务器的处理效率非常高,每次内容显示的时间极短,人眼无法分辨,因此人眼无法观察到数字的滚动,仅能看到最后显示在页面上的数字。
本申请实施例提供的页面数字显示方法,通过将数字的文字资源由字体文件变为一张数字图片来减少页面的大小;针对页面需要显示的一个数字只需生成对应的一个HTML标签,通过HTML标签可以进一步获取数字对应的样式属性,进而在数字图片中获取需要显示的数字,一个数字只需对应的一个HTML标签,进一步降低了页面的大小,提高程序的运行效率,从而数字显示不卡顿。
图5为本申请实施例提供的一种页面数字显示装置100的示意性框图。该页面数字显示装置100包括预存单元101、加载单元102、获取单元103以及读取显示单元104。
预存单元101用于预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字。
加载单元102用于加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名。
获取单元103用于根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标。
读取显示单元104用于读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
在本实施例中,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
所述读取显示单元具体用于:从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
在一些实施例中,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点。
在一些实施例中,所述加载单元102具体用于:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名;
在一些实施例中,所述获取单元103具体用于:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标;
在一些实施例中,如图6所示,所述读取显示单元104包括以下子单元:
读取子单元1041,用于在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;
逐一显示子单元1042,用于将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
上述页面数字显示装置100的作用以及各个单元的具体描述,本申请实施例未详尽之处可参考上述方法实施例,此处不做赘述。上述页面数字显示装置100可以实现为一种计算机程序的形式,计算机程序可以在如图7所示的计算机设备上运行。
图7为本申请实施例提供的一种计算机设备200的结构示意性框图。该计算机设备200,可以是终端,也可以是服务器,其中,终端可以是智能手机、平板电脑、笔记本电脑、台式电脑、个人数字助理和穿戴式设备等具有通信功能的电子设备。服务器可以是独立的服务器,也可以是多个服务器组成的服务器集群。
该计算机设备200,包括通过系统总线201连接的处理器202、存储器和网络接口205,其中,存储器可以包括非易失性存储介质203和内存储器204。
该计算机设备200的非易失性存储介质203可存储操作系统2031和计算机程序2032,该计算机程序2032被执行时,可使得处理器202执行一种页面数字显示方法。该内存储器204为非易失性存储介质203中的计算机程序2032的运行提供环境。该计算机设备200的处理器202用于提供计算和控制能力,支撑整个计算机设备200的运行。计算机设备200的网络接口205用于进行网络通信,如发送分配的任务、接收数据等。
处理器202运行非易失性存储介质203中的计算机程序2032时,执行以下步骤:
预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名;根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
在一实施例中,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点。
在执行所述加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名的步骤中,具体执行:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名。
在执行所述根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性的步骤中,具体执行:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标。
在执行所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤中,具体执行:在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
在一实施例中,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
在执行所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤中,具体执行:从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
本领域技术人员可以理解,图7中示出的计算机设备的实施例并不构成对计算机设备具体构成的限定,在其他实施例中,计算机设备可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。例如,在一些实施例中,计算机设备可以仅包括存储器及处理器,在这样的实施例中,存储器及处理器的结构及功能与图7所示实施例一致,在此不再赘述。
本申请还提供一种存储介质,所述存储介质存储有一个或者一个以上计算 机程序,所述一个或者一个以上计算机程序可被一个或者一个以上的处理器执行,可实现以下步骤:
预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名;根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
在一实施例中,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点。
在实现所述加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名的步骤中,具体实现:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名。
在实现所述根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性的步骤中,具体实现:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标。
在实现所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤中,具体实现:在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
在一实施例中,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
在实现所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字 显示在页面上的步骤中,具体实现:从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
所述存储介质可以是前述设备的内部存储单元,例如设备的硬盘或内存。所述存储介质也可以是所述设备的外部存储设备,例如所述设备上配备的插接式硬盘,智能存储卡(Smart Media Card,SMC),安全数字(Secure Digital,SD)卡,闪存卡(Flash Card)等。进一步地,所述存储介质还可以既包括所述设备的内部存储单元也包括外部存储设备。
所属领域的技术人员可以清楚地了解到,为了描述的方便和简洁,上述描述的设备、装置和单元的具体工作过程,可以参考前述方法实施例中的对应过程,在此不再赘述。本领域普通技术人员可以意识到,结合本文中所公开的实施例描述的各示例的单元及算法步骤,能够以电子硬件、计算机软件或者二者的结合来实现,为了清楚地说明硬件和软件的可互换性,在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本申请的范围。
在本申请所提供的几个实施例中,应该理解到,所揭露的设备、装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,也可以将具有相同功能的单元集合成一个单元,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另外,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口、装置或单元的间接耦合或通信连接,也可以是电的,机械的或其它的形式连接。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本申请实施例方案的目的。
另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以是两个或两个以上单元集成在一个单 元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个存储介质中。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分,或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、移动硬盘、只读存储器(ROM,Read-Only Memory)、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述,仅为本申请的具体实施方式,但本申请的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本申请揭露的技术范围内,可轻易想到各种等效的修改或替换,这些修改或替换都应涵盖在本申请的保护范围之内。因此,本申请的保护范围应以权利要求的保护范围为准。

Claims (20)

  1. 一种页面数字显示方法,其特征在于,包括:
    预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;
    加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名;
    根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;
    读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
  2. 根据权利要求1所述的页面数字显示方法,其特征在于,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点;
    所述加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名,包括:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名;
    所述根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,包括:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标;
    所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上,包括:
    在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;
    将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
  3. 根据权利要求1所述的页面数字显示方法,其特征在于,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比 例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。
  4. 根据权利要求1所述的页面数字显示方法,其特征在于,所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
  5. 根据权利要求4所述的页面数字显示方法,其特征在于,所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上,包括:
    从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
  6. 一种页面数字显示装置,其特征在于,包括:
    预存单元,用于预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;
    加载单元,用于加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名;
    获取单元,用于根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;
    读取显示单元,用于读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
  7. 根据权利要求6所述的页面数字显示装置,其特征在于,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点;
    所述加载单元具体用于:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名;
    所述获取单元具体用于:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标;
    所述读取显示单元包括:
    读取子单元,用于在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;
    逐一显示子单元,用于将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
  8. 根据权利要求6所述的页面数字显示装置,其特征在于,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。
  9. 根据权利要求6所述的页面数字显示装置,其特征在于,所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
  10. 根据权利要求9所述的页面数字显示装置,其特征在于,所述读取显示单元,具体用于:
    从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
  11. 一种计算机设备,其特征在于,包括存储器,以及与所述存储器相连的处理器;
    所述存储器用于存储实现页面数字显示方法的计算机程序;
    所述处理器用于运行所述存储器中存储的计算机程序,以执行以下步骤:
    预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;
    加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名;
    根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;
    读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
  12. 根据权利要求11所述的计算机设备,其特征在于,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点;
    所述处理器在执行所述加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名的步骤时, 具体执行以下步骤:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名;
    所述处理器在执行所述根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性的步骤时,具体执行以下步骤:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标;
    所述处理器在执行所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤时,具体执行以下步骤:在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
  13. 根据权利要求11所述的计算机设备,其特征在于,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。
  14. 根据权利要求11所述的计算机设备,其特征在于,所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
  15. 根据权利要求14所述的计算机设备,其特征在于,所述处理器在执行读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤时,具体执行以下步骤:从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
  16. 一种存储介质,其特征在于,所述存储介质存储有一个或者一个以上计算机程序,所述一个或者一个以上计算机程序可被一个或者一个以上的处理器执行,以实现以下步骤:
    预存页面HTML文件、CSS文件和数字图片,所述页面HTML文件包括需要显示在页面的数据的HTML标签,所述数据包括数字,一位数字对应一个HTML标签,所述CSS文件包括所述数字的样式属性,所述数字图片的内容包括按预设方向依序排列的预设字体的0至9的数字;
    加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名;
    根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性,所述样式属性为所述数字在所述数字图片中的位置坐标;
    读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上。
  17. 根据权利要求16所述的存储介质,其特征在于,所述需要显示在页面的数据为小数,所述页面HTML文件还包括小数点的HTML标签,所述CSS文件还包括所述小数点的样式属性,所述数字图片的内容还包括小数点;
    在实现所述加载所述页面HTML文件中的需要显示在页面的数字的HTML标签,从所述HTML标签中获取所述数字的样式名的步骤时,具体实现以下步骤:按高位数至低位数的顺序从所述页面HTML文件中逐一加载所述小数的每位数字或小数点的HTML标签,并依次从所述每位数字或小数点的HTML标签中获取对应数字或小数点的样式名;
    在实现所述根据所述数字的样式名从所述CSS文件中获取所述数字对应的样式属性的步骤时,具体实现以下步骤:在每次获取对应数字或小数点的样式名后,根据所述样式名从所述CSS文件中获取对应数字或小数点在所述数字图片中的位置坐标;
    在实现所述读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤时,具体实现以下步骤:在每次获取对应数字或小数点在所述数字图片中的位置坐标后,根据所述位置坐标从所述数字图片中读取对应数字或小数点;将每次读取到的数字或小数点按从左到右的方向逐一显示在页面上,以在所述页面上显示完整的小数。
  18. 根据权利要求16所述的存储介质,其特征在于,所述位置坐标包括横坐标和纵坐标,所述横坐标用于表示坐标点位于数字图片横向方向的比例位置,所述纵坐标均用百分比表示坐标点位于数字图片纵向方向的比例位置。
  19. 根据权利要求16所述的存储介质,其特征在于,所述数字图片中的每个数字占据的面积大小均为预设比例的所述数字图片面积。
  20. 根据权利要求19所述的存储介质,其特征在于,在实现读取所述数字图片,将所述数字图片中所述位置坐标上的数字显示在页面上的步骤时,具体实现以下步骤:从所述数字图片的起点坐标开始,沿所述预设方向读取所述数字图片的内容,每次读取预设比例的数字图片面积内的内容,将每次读取的内容覆盖上次读取并显示在页面上的内容,直至读取到所述位置坐标的内容后停止,以使所述数字显示在页面上。
PCT/CN2018/101842 2018-04-20 2018-08-23 页面数字显示方法、装置、计算机设备及存储介质 WO2019200797A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201810361312.3A CN108536864B (zh) 2018-04-20 2018-04-20 页面数字显示方法、装置、计算机设备及存储介质
CN201810361312.3 2018-04-20

Publications (1)

Publication Number Publication Date
WO2019200797A1 true WO2019200797A1 (zh) 2019-10-24

Family

ID=63478093

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2018/101842 WO2019200797A1 (zh) 2018-04-20 2018-08-23 页面数字显示方法、装置、计算机设备及存储介质

Country Status (2)

Country Link
CN (1) CN108536864B (zh)
WO (1) WO2019200797A1 (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111198997A (zh) * 2019-12-30 2020-05-26 深圳市优必选科技股份有限公司 一种基于网页的数字显示方法及装置

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102654885A (zh) * 2012-04-28 2012-09-05 北京华胜天成科技股份有限公司 移动终端网页适配系统和方法
CN102929871A (zh) * 2011-08-08 2013-02-13 腾讯科技(深圳)有限公司 一种网页浏览方法、装置及移动终端
CN102999360A (zh) * 2012-11-23 2013-03-27 奥维通信股份有限公司 基于嵌入式web-omt页面动态时钟的实现方法
CN103106079A (zh) * 2013-02-04 2013-05-15 北京奥博科贝数字科技有限公司 数字内容阅读器及其显示方法
CN103336690A (zh) * 2013-06-28 2013-10-02 优视科技有限公司 基于html5的文字元素绘制方法及装置
GB2523074A (en) * 2013-12-16 2015-08-19 Make Apps Better Ltd A method and system for modifying deployed applications

Family Cites Families (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8726174B2 (en) * 2006-06-26 2014-05-13 Oracle America, Inc. Method and system for showing a display panel in a graphical user interface
US20110087953A1 (en) * 2009-10-08 2011-04-14 Grohs Anton C Automated embeddable searchable static rendering of a webpage generator
CN102541863B (zh) * 2010-12-14 2015-08-05 联芯科技有限公司 一种应用于移动终端的网页压缩方法
CN102665127A (zh) * 2012-04-23 2012-09-12 中山大学 一种数字电视的浏览器系统
CN104239326B (zh) * 2013-06-17 2018-06-12 腾讯科技(深圳)有限公司 一种对网页字体进行缩放的方法、装置和系统
CN103685747B (zh) * 2013-12-06 2016-06-01 北京奇虎科技有限公司 输入号码的修正方法和修正装置
CN104915186B (zh) * 2014-03-12 2019-11-19 腾讯科技(深圳)有限公司 一种制作页面的方法和装置
CN106095241B (zh) * 2016-06-14 2019-07-02 武汉深之度科技有限公司 一种Web应用的窗口显示方法、装置及计算设备
CN107066186A (zh) * 2017-02-23 2017-08-18 青岛海信电器股份有限公司 一种基于Canvas的UI界面字符展示方法及显示设备

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102929871A (zh) * 2011-08-08 2013-02-13 腾讯科技(深圳)有限公司 一种网页浏览方法、装置及移动终端
CN102654885A (zh) * 2012-04-28 2012-09-05 北京华胜天成科技股份有限公司 移动终端网页适配系统和方法
CN102999360A (zh) * 2012-11-23 2013-03-27 奥维通信股份有限公司 基于嵌入式web-omt页面动态时钟的实现方法
CN103106079A (zh) * 2013-02-04 2013-05-15 北京奥博科贝数字科技有限公司 数字内容阅读器及其显示方法
CN103336690A (zh) * 2013-06-28 2013-10-02 优视科技有限公司 基于html5的文字元素绘制方法及装置
GB2523074A (en) * 2013-12-16 2015-08-19 Make Apps Better Ltd A method and system for modifying deployed applications

Also Published As

Publication number Publication date
CN108536864A (zh) 2018-09-14
CN108536864B (zh) 2022-03-08

Similar Documents

Publication Publication Date Title
CN107818008B (zh) 页面加载方法及装置
US10346004B2 (en) Systems and methods for intelligent layered interactive programmatic elements for fixed content
WO2020048326A1 (zh) 一种界面显示方法、系统及终端设备
WO2017166210A1 (zh) 应用程序的处理方法及终端设备
US10878169B2 (en) Selective synchronizing of display layouts
JP2001186334A (ja) 画像処理装置、画像処理システム、画像処理方法、及び記憶媒体
US11675483B2 (en) Client device, control method, and storage medium for smoothly exchanging the display of images on a device
CA2564389C (en) Multi-source, multi-destination data transfers
US20110119616A1 (en) Displayable-Information Management System and Program
US9548042B2 (en) Responsive document breakpoints systems and methods
US9996506B2 (en) Identifying fonts using custom ligatures
CN109213316B (zh) 自动布局引擎
AU2016256364B2 (en) Rendering graphical assets natively on multiple screens of electronic devices
CN110837366A (zh) 一种表单生成方法、电子装置及计算机可读存储介质
CN112099690A (zh) 页面缩放方法、装置、终端及存储介质
WO2019200797A1 (zh) 页面数字显示方法、装置、计算机设备及存储介质
CN110675800A (zh) 显示屏驱动方法和装置
CN109213981B (zh) 各种电子设备的演示协作
CN110471737B (zh) 一种沉浸式状态栏设置方法及相关装置
JP6536007B2 (ja) 情報処理装置、その制御方法とプログラム
CN111563157B (zh) 一种缩略图的显示方法和装置
CN110673903B (zh) 一种阅读软件的书架页面的显示方法和装置
US20170287099A1 (en) Method and apparatus for dynamic generation of vector graphics
CN110187881B (zh) 一种异形窗口创建方法、系统、装置及计算机存储介质
JP7473007B2 (ja) 表示制御システム、表示制御方法及び表示制御プログラム

Legal Events

Date Code Title Description
NENP Non-entry into the national phase

Ref country code: DE

32PN Ep: public notification in the ep bulletin as address of the adressee cannot be established

Free format text: NOTING OF LOSS OF RIGHTS PURSUANT TO RULE 112(1) EPC (EPO FORM 1205 DATED 23/02/2021)

122 Ep: pct application non-entry in european phase

Ref document number: 18915260

Country of ref document: EP

Kind code of ref document: A1