CN112597416B - 网页元素的显示方法、装置、服务器和存储介质 - Google Patents
网页元素的显示方法、装置、服务器和存储介质 Download PDFInfo
- Publication number
- CN112597416B CN112597416B CN202011508001.9A CN202011508001A CN112597416B CN 112597416 B CN112597416 B CN 112597416B CN 202011508001 A CN202011508001 A CN 202011508001A CN 112597416 B CN112597416 B CN 112597416B
- Authority
- CN
- China
- Prior art keywords
- sample
- page
- pattern
- animation
- library
- Prior art date
- Legal status (The legal status 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 status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 46
- 238000007781 pre-processing Methods 0.000 claims description 13
- 230000004044 response Effects 0.000 claims description 12
- 230000001960 triggered effect Effects 0.000 claims description 8
- 238000001514 detection method Methods 0.000 claims description 4
- 238000010586 diagram Methods 0.000 description 11
- 230000000694 effects Effects 0.000 description 7
- 230000006870 function Effects 0.000 description 3
- 230000006978 adaptation Effects 0.000 description 2
- 238000004590 computer program Methods 0.000 description 2
- 238000003672 processing method Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000008569 process Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
- G06F16/972—Access to data in other repository systems, e.g. legacy data or dynamic Web page generation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
- G06F9/44526—Plug-ins; Add-ons
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Processing Or Creating Images (AREA)
- User Interface Of Digital Computer (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本公开关于一种网页元素的显示方法、装置、服务器和存储介质，该方法包括：检测页面加载指令；响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；基于当前调用的样本样式展示指定页面元素。解决了相关技术中页面元素的动画在每次进入网页后都按照相同的样式展示的技术问题。
Description
技术领域
本公开涉及互联网领域，尤其涉及一种网页元素的显示方法、装置、服务器和存储介质。
背景技术
为了有更好的用户体验，网页页面引入了越来越多的动画效果。在某些场景中，如果动画样式按照人为预设的样式，页面会显得呆板。因此希望动画样式有一定的变化，这样会显得更加自然。
相关技术中，通常是在CSS（Cascading Style Sheets，层叠样式表）预处理语言中利用随机函数生成一个样式作为页面元素的动画样式，从而可以生成一个随机样式。但用户每次访问该页面看到的动画效果都是一样的，因此无法实现在多次打开页面时页面样式的变化。
发明内容
本公开提供一种网页元素的显示方法、装置、服务器和存储介质，以至少解决相关技术中页面元素的动画在每次进入网页后都按照相同的样式展示的问题。本公开的技术方案如下：
根据本公开实施例的第一方面，提供一种网页元素的显示方法，包括：检测页面加载指令；响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；基于当前调用的样本样式展示指定页面元素。
作为一种可选的实施例，上述方法还包括：响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：根据浏览器缓存中记录的已被使用的样本样式，确定样本库中未被使用的样本样式；从未被使用的样本样式中随机调用一个样本样式。
作为一种可选的实施例，上述方法还包括：在基于当前调用的样本样式展示指定页面元素之后，从样本库中删除已被调用的样本样式。
作为一种可选的实施例，上述方法还包括：生成样本库，其中，生成样本库的步骤包括：通过层叠样式表预处理语言随机生成一个样本样式；将随机生成的样本样式加入样本库。
作为一种可选的实施例，上述方法还包括：判断样本库中的样本样式是否到达预设数量；在样本库中的样本样式未到达预设数量的情况下，重新进入通过层叠样式表预处理语言随机生成一个样本样式的步骤。
作为一种可选的实施例，样本库中的每个样本样式的动画属性相同且动画属性值不同。
作为一种可选的实施例，在包括多个样本库的情况下，每个样本库对应一种动画属性，响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：分别从每个样本库中为待加载页面的指定页面元素随机调用一个样本样式。
作为一种可选的实施例，样本库包括动画属性相同的样本样式和动画属性不同的样本样式，其中，动画属性相同的样本样式的动画属性值不同。
作为一种可选的实施例，样本库中的每个样本样式具有对应的索引，响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：生成一个随机数；将随机数作为样式索引从样本库中选择对应的样本样式；为待加载页面的指定页面元素调用选择的样本样式。
根据本公开实施例的第二方面，提供一种网页元素的显示方法，包括：在的页面中显示动画加载控件；触发动画加载控件，生成页面加载指令，其中，页面加载指令用于指示待加载到动画页面中的页面元素；从样本库中随机调取一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；将页面元素按照当前调用的样本样式展示。
根据本公开实施例的第三方面，提供一种网页元素的显示装置，包括：检测单元，被配置为检测页面加载指令；调用单元，被配置为响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；展示单元，被配置为基于当前调用的样本样式展示指定页面元素。
作为一种可选的实施例，调用单元包括：确定单元，被配置为根据浏览器缓存中记录的已被使用的样本样式，确定样本库中未被使用的样本样式；第一随机调用单元，被配置为从未被使用的样本样式中随机调用一个样本样式。
作为一种可选的实施例，上述装置还包括：删除单元，被配置为在基于当前调用的样本样式展示指定页面元素之后，从样本库中删除已被调用的样本样式。
作为一种可选的实施例，上述装置还包括：生成单元，被配置为生成样本库，其中，生成单元包括：样本样式生成单元，被配置为通过层叠样式表预处理语言随机生成一个样本样式；加入单元，被配置为将随机生成的样本样式加入样本库。
作为一种可选的实施例，上述生成单元还包括：判断单元，被配置为判断样本库中的样本样式是否到达预设数量；重新生成单元，被配置为在样本库中的样本样式未到达预设数量的情况下，重新进入通过层叠样式表预处理语言随机生成一个样本样式的步骤。
作为一种可选的实施例，样本库中的每个样本样式的动画属性相同且动画属性值不同。
作为一种可选的实施例，在包括多个样本库的情况下，每个样本库对应一种动画属性，调用单元：随机调用单元，被配置为分别从每个样本库中为待加载页面的指定页面元素随机调用一个样本样式。
作为一种可选的实施例，样本库包括动画属性相同的样本样式和动画属性不同的样本样式，其中，动画属性相同的样本样式的动画属性值不同。
作为一种可选的实施例，样本库中的每个样本样式具有对应的索引，调用单元包括：随机数生成单元，被配置为生成一个随机数；选择单元，被配置为将随机数作为样式索引从样本库中选择对应的样本样式；样本样式调用单元，被配置为为待加载页面的指定页面元素调用选择的样本样式。
根据本公开实施例的第四方面，提供一种网页元素的显示装置，包括：显示单元，被配置为在的页面中显示动画加载控件；触发单元，被配置为触发动画加载控件，生成页面加载指令，其中，页面加载指令用于指示待加载到动画页面中的页面元素；调取单元，被配置为从样本库中随机调取一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；展示单元，被配置为将页面元素按照当前调用的样本样式展示。
根据本公开实施例的第五方面，提供一种服务器，包括：处理器；用于存储处理器可执行指令的存储器；其中，处理器被配置为执行指令，以实现上述的网页元素的显示方法。
根据本公开实施例的第六方面，提供一种存储介质，当存储介质中的指令由服务器的处理器执行时，使得服务器能够执行上述的网页元素的显示方法。
根据本公开实施例的第七方面，提供一种计算机程序产品，包括处理器；用于存储处理器可执行指令的存储器；其中，处理器被配置为执行指令，以实现上述的视频的显示方法。
本公开的实施例提供的技术方案至少带来以下有益效果：检测页面加载指令；响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；基于当前调用的样本样式展示指定页面元素。上述方案当加载待加载页面时，为待加载页面中的指定页面元素从样本库中随机调用一个样本样式，从而使得页面每次进行了重新加载之后，其中的指定页面元素都能够按照不同的样式展示，满足了页面样式的随机性，解决了相关技术中页面元素的动画在每次进入网页后都按照相同的样式展示的技术问题。
应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理，并不构成对本公开的不当限定。
图1是根据一示例性实施例示出的一种网页元素的显示方法的流程图。
图2是根据一示例性实施例示出的一种显示网页元素的示意图。
图3是根据一示例性实施例示出的一种生成样本库的示意图。
图4是根据一示例性实施例示出的一种可选的网页元素的显示方法的流程图。
图5是根据一示例性实施例示出的另一种网页元素的显示方法的流程图。
图6是根据一示例性实施例示出的一种网页元素的显示装置框图。
图7是根据一示例性实施例示出的一种网页元素的显示装置框图。
图8是根据一示例性实施例示出的一种用于执行上述视频的显示方法的电子设备800的框图。
具体实施方式
为了使本领域普通人员更好地理解本公开的技术方案，下面将结合附图，对本公开实施例中的技术方案进行清楚、完整地描述。
需要说明的是，本公开的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本公开的实施例能够以除了在这里图示或描述的那些以外的顺序实施。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。
实施例1
图1是根据一示例性实施例示出的一种网页元素的显示方法的流程图，如图1所示，网页元素的显示方法用于网页展示中，包括以下步骤。
在步骤S11中，检测页面加载指令。
具体的，上述页面加载指令用于触发网页页面进行加载展示。网页页面可以是通过web浏览器展示的页面，也可以是通过其他应用展示的H5页面，例如即时通信应用程序所提供的公众号页面，购物应用程序所提供的商品详情页面等。
在一种可选的实施例中，用户通过对智能终端进行操作进入网页页面，该操作即生成了页面加载指令，基于该页面加载指令会进行页面的加载，以展示用户请求的内容。以web浏览器为例，用户通过点击链接发送页面加载指令，浏览器接收到页面加载指令后进行页面的加载，以向智能终端返回用户所点击的链接对应的内容。
在步骤S12中，响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性。
具体的，待加载页面即为页面加载指令所请求的页面，指定网页元素可以是希望每次打开该网页时都能够展示不同样式的网页元素。上述样本库中包含预先生成的多个不同的样本样式，每个样本样式中的动画属性的属性值均不相同。
当被页面加载指令触发时，进入页面加载流程。在页面加载的过程中，需要构建网页元素节点，即DOM（Document Object Model，文档对象模型）节点。在生成网页元素节点的同时，为网页元素从样本库中随机调用一个样本样式使用。
上述样本库中包含多个不同的样本样式，可以预先生成以供指定页面元素使用。
图2是根据一示例性实施例示出的一种显示网页元素的示意图，仍以web浏览器的网页为例，在一种可选的实施例中，当用户触发进入网页时，web浏览器接收到页面加载指令，开始进行待加载页面的加载。在该页面中包含图2所示出的“鲜”、“酸”、“辣”、“烫”、“臭”、“爽”这几个文字元素，将这几个文字元素作为上述指定网页元素。设计需求是希望用户在打开页面后，能看到这六个文字表示的按钮都能具有不同的旋转方向和旋转速度。
在待加载页面的加载过程中，为这几个文字元素创建对应的DOM树的同时，从样本库中随机调用样本样式。由于样本库中的多个样本样式是不同的，因此为这六个元素调用的六个样式也不相同。更具体的，每个样式可以用于控制页面元素的一个动画参数，例如，动画周期、动画间隔、旋转方向、旋转速度、字体颜色、字体大小、图像滤镜等。
需要说明的是，上述指定网页元素可以是一个单一的网页元素，也可以是多个网页元素构成的网页元素集合，具体可以取决于在进行网页展示时的粒度。仍以图2为例，在上述的示例中，样式的展示粒度为单个的字体，即每个文字为一个指定网页元素。可选的，还可以设置两个文字为一个指定网页元素，或设置这六个文字构成的集合为一个指定的网页元素。
上述样本库中的样本样式均具有一个元素动画属性，在一种可选的实施例中，每个样本样式的元素动画属性相同，但每个样本样式的元素动画属性值不同；在另一种可选的实施例中，每个样本样式的元素动画属性可能不同，而动画属性相同的样本样式的元素动画属性值不同。
在上述步骤中，可以调用一个样本库中的样本样式，也可以调用多个样本库中的样本样式。
在步骤S13中，基于当前调用的样本样式展示指定页面元素。
基于调用的样本样式展示指定页面元素，可以是将调用的样本样式传递给也页面元素以使得页面元素应用调用的样本样式进行显示。
具体的，可以使用调用的样本样式中的动画属性值，对指定页面元素原本的动画属性值进行覆盖，即可将指定页面元素按照当前调用的样本样式展示。例如，为了实现指定页面元素旋转的动画效果，可以预先设置几个属性：旋转方向、旋转速度、动画周期、动画延时等。如果调用的样式样本所具有的属性是旋转速度，在调用该样式样本时，该样式样本的属性值所表示的旋转速度则会覆盖预先设置的旋转速度，从而使得页面元素按照样本样式进行展示。
在一种可选的实施例中，仍以图2为例，如果页面元素“鲜”所调用的样本样式为顺时针旋转，则当待加载页面加载完成显示在网页页面上时，页面元素“鲜”即会按照其所调用的样本样式动作，从而形成动画。而当用户再次进入该页面时，由于指定页面元素是随机从样本库中调用的，因此每次重新加载页面，为指定网页元素所调用的样本样式很大概率上都不相同，从容满足页面样式的随机性，提高页面展示的效果。
在本申请上述实施例中，检测页面加载指令；响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；基于当前调用的样本样式展示指定页面元素。上述方案当加载待加载页面时，为待加载页面中的指定页面元素从样本库中随机调用一个样本样式，从而使得页面每次进行了重新加载之后，其中的指定页面元素都能够按照不同的样式展示，满足了页面样式的随机性，解决了相关技术中页面元素的动画在每次进入网页后都按照相同的样式展示的技术问题。
需要说明的是，上述样本库中的样本样式越多，指定页面元素调用了相同的样本样式的概率就越小，通过上述随机调用的方式，大概率的能够使页面每次加载后指定页面元素的样式都不相同。
作为一种可选的实施例，响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：根据浏览器缓存中记录的已被使用的样本样式，确定样本库中未被使用的样本样式；从未被使用的样本样式中随机调用一个样本样式。
具体的，上述浏览器缓存中存储有每次页面被加载时为页面元素所调用的样本样式，在此基础上，为了防止所展示的页面元素的样式出现重复，可以在调用样本样式时，根据浏览器缓存的记录，选择未被调用的样本样式。
在一种可选的实施例中，样本库中的样本样式具有一一对应的表示，浏览器缓存中存储有由已被调用的样本样式的标识构成的已调用样式数组，在进行样本样式的调用时，避开已调用样式数组所对应的样本样式。例如，随机选择样本样式后，判断选择的样本样式的标识是否属于已调用样式数组，如果属于则重新进行随机选择，直至选择到标识不属于已调用样式数组的样本样式，并对选择的样本样式进行调用。
作为一种可选的实施例，在基于当前调用的样本样式展示指定页面元素之后，上述方法还包括：从样本库中删除已被调用的样本样式。
在样本库中的任意一个样本样式被调用之后，认为该样本样式已被使用过，为了避免其再次被应用，可以将其从样本库中删除。基于该方案，使得待加载页面每次加载完成后制定页面元素的样式都不相同。
需要说明的是，样本库中的样式样本的可以非常多，但为了避免样本库中的样本样式被用尽，可以向样本库中补充新的样式样本。
作为一种可选的实施例，生成预设数量的不同的样本样式的步骤包括：通过层叠样式表预处理语言随机生成一个样本样式；将随机生成的样本样式加入样本库。
具体的，样本库中的每个样本样式都不相同，具体可以是样本样式所具有的动画属性不同，或样本样式的动画属性值不同，因此随机生成的样本样式可以是随机生成预设动画属性的动画属性值构成样本样式，或动画属性和动画属性值都随机生成构成样本样式。
以SASS（Syntactically Awesome Stylesheets，一种层叠样式表语言）预处理语言为例，随机的样式动画属性可以为动画周期，为了使动画周期在时间满足[500ms,1000ms]随机，那么生成样式的方法为：animation-duration: 500ms + random(1000-500)ms。
作为一种可选的实施例，判断样本库中的样本样式是否到达预设数量；在样本库中的样本样式未到达预设数量的情况下，重新进入通过层叠样式表预处理语言随机生成一个样本样式的步骤。
图3是根据一示例性实施例示出的一种生成样本库的示意图，结合图3所示，每生成一个样本样式并将其加入样本库后，判断样本库中已有的样本样式的数量是否达到预设数量，如果没有达到，则继续使用CSS预处理语言生成一个新的随机样式，否则样本库生成完毕。
作为一种可选的实施例，样本库中的每个样本样式的动画属性相同且动画属性值不同。
在上述方案中，每个样本样式的动画属性相同，即样本库中的每个样本样式都用于对同一种动画属性进行调整。
在一种可选的实施例中，以上述动画属性为动画周期为例，为了达到指定页面元素的动画周期随机的效果，可以设置样本库中的样本样式的动画属性均为动画周期，但动画属性值随机生成，即可生成动画属性均为动画周期，但每个样本样式对应的动画周期不同的样本样式。类似的，为了达到指定页面元素的动画延时随机的效果，可以设置样本库中的样本样式的动画属性均为动画延时，但动画属性值随机生成，即可生成动画属性均为动画延时，但每个样本样式对应的动画延时不同的样本样式。
作为一种可选的实施例，在包括多个样本库的情况下，每个样本库对应一种动画属性，响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：分别从每个样本库中为待加载页面的指定页面元素随机调用一个样本样式。
在上述方案中，每个样本库对应一种动画属性，例如，可以设置两个样本库，其中一个样本库中的样本样式的动画属性均为动画周期，每个样本样式的动画周期不同；另一个样本库中的样本样式的动画属性均为动画延时，每个样本样式的动画延时不同。在生成指定页面元素的DOM节点时，从两个样本库中分别随机调用一个样式样本，从而使得页面元素的两个动画属性都是随机的，进而使得页面元素的显示方式更加多样化。
作为一种可选的实施例，样本库包括动画属性相同的样本样式和动画属性不同的样本样式，其中，动画属性相同的样本样式的动画属性值不同。
在另一种可选的实施例中，可以生成动画属性和动画属性值都是随机的样本样式来构成样本库。在这种示例中，样本库中有些样本样式用于控制指定页面元素的动画周期，有些样本样式用于控制指定页面元素的动画延时，有些样本样式用于控制指定页面元素的元素大小，也即每个样本样式的动画属性并不相同。但允许存在动画属性相同的样本样式，对于动画属性相同的样本样式，其动画属性值不同。
作为一种可选的实施例，样本库中的每个样本样式具有对应的索引，响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：生成一个随机数；将随机数作为样式索引从样本库中选择对应的样本样式；为待加载页面的指定页面元素调用选择的样本样式。
具体的，样本库中的样本样式和索引具有一一对应关系，例如索引用k表示，样本样式用sk表示，则样本库中可以以k-sk的方式对样本样式进行存储。
在一种可选的实施例中，可以通过Random函数生成一个随机数，将该随机数作为索引从样本库中查找到对应的样本样式，将查找到的样本样式作为选中的样本样式进行调用。
在上述方案中，通过随机数生成函数生成的随机数作为索引从样本库中调用样本样式，从而使每次加载待加载页面后调用的样本样式都不相同，进而实现了指定网页元素显示的随机性。
图4是根据一示例性实施例示出的一种可选的网页元素的显示方法的流程图，结合图4所示，利用js的Random方法，从样本库选择一个样式索引k，通过k可以找到对应的样本样式sk，将sk赋值给指定页面元素，同时，更新候选样本库，从样本库中删除索引k对应的样本sk，避免后续选择到同一样式样本。
实施例2
图5是根据一示例性实施例示出的另一种网页元素的显示方法的流程图，如图5所示，网页元素的显示方法用于网页展示中，包括以下步骤。
在步骤S51中，在的页面中显示动画加载控件。
具体的，上述动画加载控件可以是用于触发动画页面加载指令的控件，其中，在动画页面加载指令被触发的情况下，包含动画页面元素的页面将会被加载。
在步骤S52中，触发动画加载控件，生成页面加载指令，其中，页面加载指令用于指示待加载到动画页面中的页面元素。
具体的，上述页面加载指令用于触发网页页面进行加载展示。网页页面可以是通过web浏览器展示的页面，也可以是通过其他应用展示的H5页面，例如即时通信应用程序所提供的公众号页面，购物应用程序所提供的商品详情页面等。
在步骤S53中，从样本库中随机调取一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性。
具体的，待加载页面即为页面加载指令所请求的页面，指定网页元素可以是希望每次打开该网页时都能够展示不同样式的网页元素。上述样本库中包含预先生成的多个不同的样本样式，每个样本样式中的动画属性的属性值均不相同。
当被页面加载指令触发时，进入页面加载流程。在页面加载的过程中，需要构建网页元素节点，即DOM（Document Object Model，文档对象模型）节点。在生成网页元素节点的同时，为网页元素从样本库中随机调用一个样本样式使用。
上述样本库中包含多个不同的样本样式，可以预先生成以供指定页面元素使用。
在步骤S54中，将页面元素按照当前调用的样本样式展示。
基于调用的样本样式展示指定页面元素，可以是将调用的样本样式传递给也页面元素以使得页面元素应用调用的样本样式进行显示。
具体的，可以使用调用的样本样式中的动画属性值，对指定页面元素原本的动画属性值进行覆盖，即可将指定页面元素按照当前调用的样本样式展示。例如，为了实现指定页面元素旋转的动画效果，可以预先设置几个属性：旋转方向、旋转速度、动画周期、动画延时等。如果调用的样式样本所具有的属性是旋转速度，在调用该样式样本时，该样式样本的属性值所表示的旋转速度则会覆盖预先设置的旋转速度，从而使得页面元素按照样本样式进行展示。
在本申请上述实施例中，检测页面加载指令；在的页面中显示动画加载控件；触发动画加载控件，生成页面加载指令，其中，页面加载指令用于指示待加载到动画页面中的页面元素；从样本库中随机调取一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；将页面元素按照当前调用的样本样式展示。上述方案当加载待加载页面时，为待加载页面中的指定页面元素从样本库中随机调用一个样本样式，从而使得页面每次进行了重新加载之后，其中的指定页面元素都能够按照不同的样式展示，满足了页面样式的随机性，解决了相关技术中页面元素的动画在每次进入网页后都按照相同的样式展示的技术问题。
实施例3
图6是根据一示例性实施例示出的一种网页元素的显示装置框图。参照图6，该装置包括检测单元161，调用单元162和展示单元163。
该检测单元161被配置为检测页面加载指令。
该调用单元162被配置为响应页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性。
该展示单元163被配置为基于当前调用的样本样式展示指定页面元素。
作为一种可选的实施例，调用单元包括：
确定单元，被配置为根据浏览器缓存中记录的已被使用的样本样式，确定样本库中未被使用的样本样式；
第一随机调用单元，被配置为从未被使用的样本样式中随机调用一个样本样式。
作为一种可选的实施例，装置还包括：
删除单元，被配置为在基于当前调用的样本样式展示指定页面元素之后，从样本库中删除已被调用的样本样式。
作为一种可选的实施例，装置还包括：生成单元，被配置为生成样本库，其中，生成单元包括：样本样式生成单元，被配置为通过层叠样式表预处理语言随机生成一个样本样式；加入单元，被配置为将随机生成的样本样式加入样本库。
作为一种可选的实施例，生成单元还包括：判断单元，被配置为判断样本库中的样本样式是否到达预设数量；重新生成单元，被配置为在样本库中的样本样式未到达预设数量的情况下，重新进入通过层叠样式表预处理语言随机生成一个样本样式的步骤。
作为一种可选的实施例，样本库中的每个样本样式的动画属性相同且动画属性值不同。
作为一种可选的实施例，在包括多个样本库的情况下，每个样本库对应一种动画属性，调用单元：随机调用单元，被配置为分别从每个样本库中为待加载页面的指定页面元素随机调用一个样本样式。
作为一种可选的实施例，样本库包括动画属性相同的样本样式和动画属性不同的样本样式，其中，动画属性相同的样本样式的动画属性值不同。
作为一种可选的实施例，样本库中的每个样本样式具有对应的索引，调用单元包括：随机数生成单元，被配置为生成一个随机数；选择单元，被配置为将随机数作为样式索引从样本库中选择对应的样本样式；样本样式调用单元，被配置为为待加载页面的指定页面元素调用选择的样本样式。
关于上述实施例中的装置，其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。
实施例4
图7是根据一示例性实施例示出的一种网页元素的显示装置框图。参照图7，该装置包括显示单元171，触发单元172、调取单元173和展示单元174。
显示单元171，被配置为在的页面中显示动画加载控件。
触发单元172，被配置为触发动画加载控件，生成页面加载指令，其中，页面加载指令用于指示待加载到动画页面中的页面元素。
调取单元173，被配置为从样本库中随机调取一个样本样式，其中，样本库包括多个不同的样本样式，每个样本样式具有一个动画属性；
展示单元174，被配置为将页面元素按照当前调用的样本样式展示。
实施例5
本公开实施例还提出了一种电子设备，包括：处理器；用于存储所述处理器可执行指令的存储器；其中，所述处理器被配置为执行所述指令，以实现如实施例1所述的视频的显示方法。
实施例6
图8是根据一示例性实施例示出的一种用于执行上述视频的显示方法的电子设备800的框图。
在示例性实施例中，还提供了一种包括指令的存储介质，例如包括指令的存储器804，上述指令可由装置800的处理器820执行以完成上述方法。可选地，存储介质可以是非临时性计算机可读存储介质，例如，所述非临时性计算机可读存储介质可以是ROM、随机存取存储器（RAM）、CD-ROM、磁带、软盘和光数据存储设备等。
当上述存储介质中的指令由电子设备的处理器执行时，使得电子设备能够执行如实施例1所述的数据处理方法。
实施例7
本公开实施例还提出了一种计算机程序产品，包括处理器；用于存储所述处理器可执行指令的存储器；其中，所述处理器被配置为执行所述指令，以实现实施例1所述的视频的显示处理方法。
本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本公开的真正范围和精神由下面的权利要求指出。
应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。
Claims (18)
1.一种网页元素的显示方法，其特征在于，包括：
检测页面加载指令，所述页面加载指令由动画加载控件触发；
响应所述页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，所述样本库包括多个不同的样本样式，每个样本样式具有一个动画属性，所述样本库中的每个样本样式的动画属性相同且动画属性值不同，或所述样本库中的每个样本样式的动画属性不同，在所述待加载页面加载时构建页面元素节点，所述页面元素节点用于调用一个样本样式，所述响应所述页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：根据浏览器缓存中记录的已被使用的样本样式，确定所述样本库中未被使用的样本样式；从所述未被使用的样本样式中随机调用一个样本样式；
基于当前调用的所述样本样式展示所述指定页面元素。
2.根据权利要求1所述的显示方法，其特征在于，在基于当前调用的所述样本样式展示所述指定页面元素之后，所述方法还包括：
从所述样本库中删除已被调用的所述样本样式。
3.根据权利要求1所述的显示方法，其特征在于，所述方法还包括：生成所述样本库，其中，所述生成所述样本库的步骤包括：
通过层叠样式表预处理语言随机生成一个样本样式；
将随机生成的所述样本样式加入所述样本库。
4.根据权利要求1所述的显示方法，其特征在于，在将随机生成的所述样本样式加入所述样本库之后，所述方法还包括：
判断所述样本库中的样本样式是否到达预设数量；
在所述样本库中的样本样式未到达所述预设数量的情况下，重新进入通过层叠样式表预处理语言随机生成一个样本样式的步骤。
5.根据权利要求1所述的显示方法，其特征在于，在包括多个样本库的情况下，每个样本库对应一种动画属性，所述响应所述页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：
分别从每个样本库中为待加载页面的指定页面元素随机调用一个样本样式。
6.根据权利要求1所述的显示方法，其特征在于，所述样本库包括动画属性相同的样本样式和动画属性不同的样本样式，其中，所述动画属性相同的样本样式的动画属性值不同。
7.根据权利要求1所述的显示方法，其特征在于，所述样本库中的每个样本样式具有对应的索引，所述响应所述页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式的步骤包括：
生成一个随机数；
将所述随机数作为样式索引从所述样本库中选择对应的样本样式；
为待加载页面的指定页面元素调用选择的样本样式。
8.一种网页元素的显示方法，其特征在于，包括：
在的页面中显示动画加载控件；
触发所述动画加载控件，生成页面加载指令，其中，所述页面加载指令用于指示待加载到动画页面中的页面元素，所述页面加载指令由所述动画加载控件触发；
从样本库中随机调取一个样本样式，其中，所述样本库包括多个不同的样本样式，每个样本样式具有一个动画属性，所述样本库中的每个样本样式的动画属性相同且动画属性值不同，或所述样本库中的每个样本样式的动画属性不同，在所述待加载页面加载时构建页面元素节点，所述页面元素节点用于调用一个样本样式，所述从样本库中随机调取一个样本样式的步骤包括：根据浏览器缓存中记录的已被使用的样本样式，确定所述样本库中未被使用的样本样式；从所述未被使用的样本样式中随机调用一个样本样式；
将所述页面元素按照当前调用的所述样本样式展示。
9.一种网页元素的显示装置，其特征在于，包括：
检测单元，被配置为检测页面加载指令，所述页面加载指令由动画加载控件触发；
调用单元，被配置为响应所述页面加载指令，确定待加载页面中的指定页面元素，并从样本库中随机调用一个样本样式，其中，所述样本库包括多个不同的样本样式，每个样本样式具有一个动画属性，所述样本库中的每个样本样式的动画属性相同且动画属性值不同，其中，所述动画属性相同的样本样式的动画属性值不同，或所述样本库中的每个样本样式的动画属性不同，在所述待加载页面加载时构建页面元素节点，所述页面元素节点用于调用一个样本样式，所述调用单元包括：确定单元，被配置为根据浏览器缓存中记录的已被使用的样本样式，确定所述样本库中未被使用的样本样式；第一随机调用单元，被配置为从所述未被使用的样本样式中随机调用一个样本样式；
展示单元，被配置为基于当前调用的所述样本样式展示所述指定页面元素。
10.根据权利要求9所述的显示装置，其特征在于，所述装置还包括：
删除单元，被配置为在基于当前调用的所述样本样式展示所述指定页面元素之后，从所述样本库中删除已被调用的所述样本样式。
11.根据权利要求9所述的显示装置，其特征在于，所述装置还包括：生成单元，被配置为生成所述样本库，其中，所述生成单元包括：
样本样式生成单元，被配置为通过层叠样式表预处理语言随机生成一个样本样式；
加入单元，被配置为将随机生成的所述样本样式加入所述样本库。
12.根据权利要求11所述的显示装置，其特征在于，所述生成单元包括：
判断单元，被配置为判断所述样本库中的样本样式是否到达预设数量；
重新生成单元，被配置为在所述样本库中的样本样式未到达所述预设数量的情况下，重新进入通过层叠样式表预处理语言随机生成一个样本样式的步骤。
13.根据权利要求9所述的显示装置，其特征在于，所述样本库中的每个样本样式的动画属性相同且动画属性值不同。
14.根据权利要求13所述的显示装置，其特征在于，在包括多个样本库的情况下，每个样本库对应一种动画属性，所述调用单元：
第二随机调用单元，被配置为分别从每个样本库中为待加载页面的指定页面元素随机调用一个样本样式。
15.根据权利要求9所述的显示装置，其特征在于，所述样本库中的每个样本样式具有对应的索引，所述调用单元包括：
随机数生成单元，被配置为生成一个随机数；
选择单元，被配置为将所述随机数作为样式索引从所述样本库中选择对应的样本样式；
样本样式调用单元，被配置为为待加载页面的指定页面元素调用选择的样本样式。
16.一种网页元素的显示装置，其特征在于，包括：
显示单元，被配置为在的页面中显示动画加载控件；
触发单元，被配置为触发所述动画加载控件，生成页面加载指令，其中，所述页面加载指令用于指示待加载到动画页面中的页面元素，所述页面加载指令由所述动画加载控件触发；
调取单元，被配置为从样本库中随机调取一个样本样式，其中，所述样本库包括多个不同的样本样式，每个样本样式具有一个动画属性，所述样本库中的每个样本样式的动画属性相同且动画属性值不同，其中，所述动画属性相同的样本样式的动画属性值不同，或所述样本库中的每个样本样式的动画属性不同，在所述待加载页面加载时构建页面元素节点，所述页面元素节点用于调用一个样本样式，所述从样本库中随机调取一个样本样式的步骤包括：根据浏览器缓存中记录的已被使用的样本样式，确定所述样本库中未被使用的样本样式；从所述未被使用的样本样式中随机调用一个样本样式；
展示单元，被配置为将所述页面元素按照当前调用的所述样本样式展示。
17.一种服务器，其特征在于，包括：
处理器；
用于存储所述处理器可执行指令的存储器;
其中，所述处理器被配置为执行所述指令，以实现如权利要求1至8中任一项所述的网页元素的显示方法。
18.一种存储介质，其特征在于，当所述存储介质中的指令由服务器的处理器执行时，使得服务器能够执行如权利要求1至8中任一项所述的网页元素的显示方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011508001.9A CN112597416B (zh) | 2020-12-18 | 2020-12-18 | 网页元素的显示方法、装置、服务器和存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011508001.9A CN112597416B (zh) | 2020-12-18 | 2020-12-18 | 网页元素的显示方法、装置、服务器和存储介质 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN112597416A CN112597416A (zh) | 2021-04-02 |
| CN112597416B true CN112597416B (zh) | 2024-03-01 |
Family
ID=75199395
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011508001.9A Active CN112597416B (zh) | 2020-12-18 | 2020-12-18 | 网页元素的显示方法、装置、服务器和存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112597416B (zh) |
Families Citing this family (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN116991530B (zh) * | 2023-09-25 | 2023-12-01 | 成都数联云算科技有限公司 | 一种具有交错收缩样式加载指示符的实现方法 |
Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102662672A (zh) * | 2012-04-05 | 2012-09-12 | 广州市动景计算机科技有限公司 | 对网页进行换肤处理的方法和装置以及移动终端 |
| CN106557556A (zh) * | 2016-11-08 | 2017-04-05 | 北京奇虎科技有限公司 | 一种网页页面的展示方法、装置、服务器和系统 |
| CN107066618A (zh) * | 2017-05-09 | 2017-08-18 | 灯塔财经信息有限公司 | 一种网页页面转换后显示方法和装置 |
| CN107454453A (zh) * | 2017-08-18 | 2017-12-08 | 武汉斗鱼网络科技有限公司 | 一种直播平台随机动画展示方法和装置 |
| CN108959475A (zh) * | 2018-06-20 | 2018-12-07 | 联动优势电子商务有限公司 | 一种网页设置方法及装置 |
| CN110502308A (zh) * | 2019-08-28 | 2019-11-26 | 广州酷狗计算机科技有限公司 | 页面样式切换方法、装置、计算机设备及存储介质 |
| CN110609715A (zh) * | 2019-08-13 | 2019-12-24 | 平安国际智慧城市科技股份有限公司 | 随机选项页面展示方法、装置、计算机设备和存储介质 |
| CN111158686A (zh) * | 2019-12-31 | 2020-05-15 | 京东数字科技控股有限公司 | 网页弹框生成方法及装置、电子设备、存储介质 |
| CN111708969A (zh) * | 2020-06-17 | 2020-09-25 | 北京明略软件系统有限公司 | 一种网页的配置方法、装置、电子设备及存储介质 |
Family Cites Families (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US9171098B2 (en) * | 2011-09-30 | 2015-10-27 | Microsoft Technology Licensing, Llc | Decomposing markup language elements for animation |
| CN108255916A (zh) * | 2017-09-14 | 2018-07-06 | 广州市动景计算机科技有限公司 | 网页页面呈现的方法、设备、客户端装置和电子设备 |
-
2020
- 2020-12-18 CN CN202011508001.9A patent/CN112597416B/zh active Active
Patent Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102662672A (zh) * | 2012-04-05 | 2012-09-12 | 广州市动景计算机科技有限公司 | 对网页进行换肤处理的方法和装置以及移动终端 |
| CN106557556A (zh) * | 2016-11-08 | 2017-04-05 | 北京奇虎科技有限公司 | 一种网页页面的展示方法、装置、服务器和系统 |
| CN107066618A (zh) * | 2017-05-09 | 2017-08-18 | 灯塔财经信息有限公司 | 一种网页页面转换后显示方法和装置 |
| CN107454453A (zh) * | 2017-08-18 | 2017-12-08 | 武汉斗鱼网络科技有限公司 | 一种直播平台随机动画展示方法和装置 |
| CN108959475A (zh) * | 2018-06-20 | 2018-12-07 | 联动优势电子商务有限公司 | 一种网页设置方法及装置 |
| CN110609715A (zh) * | 2019-08-13 | 2019-12-24 | 平安国际智慧城市科技股份有限公司 | 随机选项页面展示方法、装置、计算机设备和存储介质 |
| CN110502308A (zh) * | 2019-08-28 | 2019-11-26 | 广州酷狗计算机科技有限公司 | 页面样式切换方法、装置、计算机设备及存储介质 |
| CN111158686A (zh) * | 2019-12-31 | 2020-05-15 | 京东数字科技控股有限公司 | 网页弹框生成方法及装置、电子设备、存储介质 |
| CN111708969A (zh) * | 2020-06-17 | 2020-09-25 | 北京明略软件系统有限公司 | 一种网页的配置方法、装置、电子设备及存储介质 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN112597416A (zh) | 2021-04-02 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10318360B2 (en) | Registry for app features referenced pointers and pointer definitions | |
| CN109902220B (zh) | 网页信息获取方法、装置和计算机可读存储介质 | |
| US8756593B2 (en) | Map generator for representing interrelationships between app features forged by dynamic pointers | |
| US9418243B2 (en) | Invoking a private browsing mode by selection of a visual control element within a browser tab | |
| CN110209966B (zh) | 一种网页刷新方法、网页系统及电子设备 | |
| US20030030668A1 (en) | Method and apparatus for tracking usage of online help systems | |
| US20130318496A1 (en) | Detection of central-registry events influencing dynamic pointers and app feature dependencies | |
| CN108334517A (zh) | 一种网页渲染方法及相关设备 | |
| CN104956362A (zh) | 分析web应用程序的结构 | |
| CN111597475B (zh) | 一种返回页面的方法、装置、电子设备及计算机存储介质 | |
| CN112131121B (zh) | 用户界面的模糊检测方法、装置、电子设备和存储介质 | |
| CN112597416B (zh) | 网页元素的显示方法、装置、服务器和存储介质 | |
| US20170212735A1 (en) | Replicating a web technology | |
| CN110968314A (zh) | 一种页面生成方法及装置 | |
| CN111783019A (zh) | 浏览器子页面创建方法、装置、计算机设备和存储介质 | |
| CN108319474B (zh) | 一种页面信息生成方法、装置和设备 | |
| CN103559228A (zh) | 浏览器中标签页的加载方法及装置 | |
| CN111399836B (zh) | 修改页面属性的方法及装置 | |
| CN108268298A (zh) | 桌面图标的生成方法、装置、存储介质及电子设备 | |
| CN115481025A (zh) | 自动化测试的脚本录制方法、装置、计算机设备及介质 | |
| CN113468050A (zh) | 基于画布的测试方法、装置、计算机设备及存储介质 | |
| CN113468450A (zh) | 一种页面控制方法及装置 | |
| CN115665480B (zh) | 一种数据渲染方法、装置、计算机设备和存储介质 | |
| CN115438282B (zh) | 页面中元素的定位方法及装置 | |
| CN117520691B (zh) | 一种条目化数据显示方法、装置、存储介质及电子设备 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |