CN110968810A - 网页数据处理方法和装置 - Google Patents

网页数据处理方法和装置 Download PDF

Info

Publication number
CN110968810A
CN110968810A CN201811162006.3A CN201811162006A CN110968810A CN 110968810 A CN110968810 A CN 110968810A CN 201811162006 A CN201811162006 A CN 201811162006A CN 110968810 A CN110968810 A CN 110968810A
Authority
CN
China
Prior art keywords
picture
webpage
attribute information
pseudo element
pseudo
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.)
Pending
Application number
CN201811162006.3A
Other languages
English (en)
Inventor
罗尖
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Gridsum Technology Co Ltd
Original Assignee
Beijing Gridsum Technology Co Ltd
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 Beijing Gridsum Technology Co Ltd filed Critical Beijing Gridsum Technology Co Ltd
Priority to CN201811162006.3A priority Critical patent/CN110968810A/zh
Publication of CN110968810A publication Critical patent/CN110968810A/zh
Pending legal-status Critical Current

Links

Images

Landscapes

  • Information Transfer Between Computers (AREA)

Abstract

本发明公开了一种网页数据处理方法和装置。该方法包括:监听到网页中图片的错误事件;浏览器向服务器请求用于表征图片的伪元素字符的属性信息;在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符。通过本发明,达到了网页图片错误时不出现死循环的效果。

Description

网页数据处理方法和装置
技术领域
本发明涉及计算机领域,具体而言,涉及一种网页数据处理方法和装置。
背景技术
对于图片(img)元素来说,伪元素:before和:after默认是不起作用的,而一旦图片加载失败这两个伪元素将出现。在具体应用场景中,网页上经常会显示有很多图片,如果图片加载错误,例如断网,则可能会不停重复加载,造成死循环。
为了解决这一问题,现有的方案通过监听img的onerror事件,用javascript将错误图片的url替换成默认图片的url。但是,当默认图片出错时,程序会不断替换 url,依然会造成死循环,需要做额外的工作防止这一错误发生。
针对相关技术中网页图片错误时出现死循环的问题,目前尚未提出有效的解决方案。
发明内容
本发明的主要目的在于提供一种网页数据处理方法和装置,以解决网页图片错误时出现死循环的问题。
为了实现上述目的,根据本发明的一个方面,提供了一种网页数据处理方法,该方法包括:监听到网页中图片的错误事件;浏览器向服务器请求用于表征图片的伪元素字符的属性信息;在接收到服务器发送的所述属性信息后,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符。
进一步地,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符包括:获取所述伪元素字符;从所述属性信息后中解析出所述伪元素字符的字体和样式;根据所述伪元素字符的字体和样式渲染所述图片的伪元素字符。
进一步地,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符包括:获取网页中所述图片的坐标位置;根据所述属性信息渲染预设的所述图片的伪元素字符,将所述图片的伪元素字符显示在所述网页中的所述坐标位置处。
进一步地,监听到网页中图片的错误事件包括:通过JavaScript监听网页中图片的onerror事件。
为了实现上述目的,根据本发明的另一方面,还提供了一种网页数据处理装置,该装置包括:监听单元,用于监听到网页中图片的错误事件;请求单元,用于浏览器向服务器请求用于表征图片的伪元素字符的属性信息;显示单元,用于在接收到服务器发送的所述属性信息后,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符。
进一步地,所述显示单元包括:获取模块,用于获取所述伪元素字符;解析模块,用于从所述属性信息后中解析出所述伪元素字符的字体和样式;渲染模块,用于根据所述伪元素字符的字体和样式渲染所述图片的伪元素字符。
进一步地,所述显示单元包括:获取模块,用于获取网页中所述图片的坐标位置;显示模块,用于根据所述属性信息渲染预设的所述图片的伪元素字符,将所述图片的伪元素字符显示在所述网页中的所述坐标位置处。
进一步地,所述监听单元用于:通过JavaScript监听网页中图片的onerror事件。
为了实现上述目的,根据本发明的另一方面,还提供了一种存储介质,包括存储的程序,其中,在所述程序运行时控制所述存储介质所在设备执行本发明的网页数据处理方法。
为了实现上述目的,根据本发明的另一方面,还提供了一种处理器,用于运行程序,其中,所述程序运行时执行本发明的网页数据处理方法。
本发明通过监听到网页中图片的错误事件;浏览器向服务器请求用于表征图片的伪元素字符的属性信息;在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符,解决了网页图片错误时出现死循环的问题,进而达到了网页图片错误时不出现死循环的效果。
附图说明
构成本申请的一部分的附图用来提供对本发明的进一步理解,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是根据本发明实施例的网页数据处理方法的流程图;
图2是根据本发明实施例的网页数据处理装置的示意图。
具体实施方式
需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。
为了使本技术领域的人员更好地理解本申请方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分的实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。
需要说明的是,本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本申请的实施例。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
本发明实施例提供了一种网页数据处理方法。
图1是根据本发明实施例的网页数据处理方法的流程图,如图1所示,该方法包括以下步骤:
步骤S102:监听到网页中图片的错误事件;
步骤S104:浏览器向服务器请求用于表征图片的伪元素字符的属性信息;
步骤S106:在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符。
该实施例采用监听到网页中图片的错误事件;浏览器向服务器请求用于表征图片的伪元素字符的属性信息;在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符,解决了网页图片错误时出现死循环的问题,进而达到了网页图片错误时不出现死循环的效果。
本发明实施例的技术方案可以作为一种用css实现错误图片替换的方案,本发明实施例的技术方案中,图片的错误事件可以是通过onerror函数监听,浏览器向服务器请求属性信息,属性信息用于描述伪元素字符的字体、大小、颜色等信息,伪元素字符是字符,而不是图片,将伪元素字符显示在网页中作为错误事件的替换图片,不会再出现死循环。
可选地,根据属性信息在网页中显示预设的图片的伪元素字符包括:获取伪元素字符;从属性信息后中解析出伪元素字符的字体和样式;根据伪元素字符的字体和样式渲染图片的伪元素字符。
在获取到属性信息后,可以从属性信息中解析出伪元素字符的字体和样式,然后根据解析出的内容来渲染图片的伪元素字符。
可选地,根据属性信息在网页中显示预设的图片的伪元素字符包括:获取网页中图片的坐标位置;根据属性信息渲染预设的图片的伪元素字符,将图片的伪元素字符显示在网页中的坐标位置处。
伪元素字符是用于在图片出现错误时显示,具体的显示位置可以根据图片的坐标位置来确定,这样可以实现在网页中的原来图片的坐标位置处显示伪元素字符。
可选地,监听到网页中图片的错误事件包括:通过JavaScript监听网页中图片的onerror事件。
在监听网页中图片的错误事件时,可以通过JavaScript来监听图片的onerror事件。
本发明实施例还提供了一种优选实施方式。
本发明实施例使用的代码如下:
Figure BDA0001820218060000041
只需在img伪元素中添加content,并指定font-family即可实现用伪元素字符作为图片错误事件的替代字符,防止替代图片也出现问题的死循环。对比相关技术中的方案:js监听img的onerror事件,再将错误图片的url替换成默认图片的url,当默认图片出错时,程序会陷入死循环。本发明实施例通过img的伪元素解决图片替换问题,具备通用性,代码简单利于维护。
需要说明的是,在附图的流程图示出的步骤可以在诸如一组计算机可执行指令的计算机系统中执行,并且,虽然在流程图中示出了逻辑顺序,但是在某些情况下,可以以不同于此处的顺序执行所示出或描述的步骤。
本发明实施例提供了一种网页数据处理装置,该装置可以用于执行本发明实施例的网页数据处理方法。
图2是根据本发明实施例的网页数据处理装置的示意图,如图2所示,该装置包括:
监听单元10,用于监听到网页中图片的错误事件;
请求单元20,用于浏览器向服务器请求用于表征图片的伪元素字符的属性信息;
显示单元30,用于在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符。
该实施例采用监听单元10,用于监听到网页中图片的错误事件;请求单元20,用于浏览器向服务器请求用于表征图片的伪元素字符的属性信息;显示单元30,用于在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符,从而解决了网页图片错误时出现死循环的问题,进而达到了网页图片错误时不出现死循环的效果。
可选地,显示单元30包括:获取模块,用于获取伪元素字符;解析模块,用于从属性信息后中解析出伪元素字符的字体和样式;渲染模块,用于根据伪元素字符的字体和样式渲染图片的伪元素字符。
可选地,显示单元30包括:获取模块,用于获取网页中图片的坐标位置;显示模块,用于根据属性信息渲染预设的图片的伪元素字符,将图片的伪元素字符显示在网页中的坐标位置处。
可选地,监听单元10用于:通过JavaScript监听网页中图片的onerror事件。
所述网页数据处理装置包括处理器和存储器,上述监听单元、请求单元、显示单元等均作为程序单元存储在存储器中,由处理器执行存储在存储器中的上述程序单元来实现相应的功能。
处理器中包含内核,由内核去存储器中调取相应的程序单元。内核可以设置一个或以上,通过调整内核参数来网页图片错误时不出现死循环。
存储器可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM),存储器包括至少一个存储芯片。
本发明实施例提供了一种存储介质,其上存储有程序,该程序被处理器执行时实现所述网页数据处理方法。
本发明实施例提供了一种处理器,所述处理器用于运行程序,其中,所述程序运行时执行所述网页数据处理方法。
本发明实施例提供了一种设备,设备包括处理器、存储器及存储在存储器上并可在处理器上运行的程序,处理器执行程序时实现以下步骤:监听到网页中图片的错误事件;浏览器向服务器请求用于表征图片的伪元素字符的属性信息;在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符。本文中的设备可以是服务器、PC、PAD、手机等。
本申请还提供了一种计算机程序产品,当在数据处理设备上执行时,适于执行初始化有如下方法步骤的程序:监听到网页中图片的错误事件;浏览器向服务器请求用于表征图片的伪元素字符的属性信息;在接收到服务器发送的属性信息后,根据属性信息在网页中显示预设的图片的伪元素字符。
本领域内的技术人员应明白,本申请的实施例可提供为方法、系统、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等) 上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
在一个典型的配置中,计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。
存储器可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM)。存储器是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。按照本文中的界定,计算机可读介质不包括暂存电脑可读媒体(transitory media),如调制的数据信号和载波。
还需要说明的是,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括要素的过程、方法、商品或者设备中还存在另外的相同要素。
本领域技术人员应明白,本申请的实施例可提供为方法、系统或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
以上仅为本申请的实施例而已,并不用于限制本申请。对于本领域技术人员来说,本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等,均应包含在本申请的权利要求范围之内。

Claims (10)

1.一种网页数据处理方法,其特征在于,包括:
监听到网页中图片的错误事件;
浏览器向服务器请求用于表征图片的伪元素字符的属性信息;
在接收到服务器发送的所述属性信息后,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符。
2.根据权利要求1所述的方法,其特征在于,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符包括:
获取所述伪元素字符;
从所述属性信息后中解析出所述伪元素字符的字体和样式;
根据所述伪元素字符的字体和样式渲染所述图片的伪元素字符。
3.根据权利要求1所述的方法,其特征在于,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符包括:
获取网页中所述图片的坐标位置;
根据所述属性信息渲染预设的所述图片的伪元素字符,将所述图片的伪元素字符显示在所述网页中的所述坐标位置处。
4.根据权利要求1所述的方法,其特征在于,监听到网页中图片的错误事件包括:
通过JavaScript监听网页中图片的onerror事件。
5.一种网页数据处理装置,其特征在于,包括:
监听单元,用于监听到网页中图片的错误事件;
请求单元,用于浏览器向服务器请求用于表征图片的伪元素字符的属性信息;
显示单元,用于在接收到服务器发送的所述属性信息后,根据所述属性信息在所述网页中显示预设的所述图片的伪元素字符。
6.根据权利要求5所述的装置,其特征在于,所述显示单元包括:
获取模块,用于获取所述伪元素字符;
解析模块,用于从所述属性信息后中解析出所述伪元素字符的字体和样式;
渲染模块,用于根据所述伪元素字符的字体和样式渲染所述图片的伪元素字符。
7.根据权利要求5所述的装置,其特征在于,所述显示单元包括:
获取模块,用于获取网页中所述图片的坐标位置;
显示模块,用于根据所述属性信息渲染预设的所述图片的伪元素字符,将所述图片的伪元素字符显示在所述网页中的所述坐标位置处。
8.根据权利要求5所述的装置,其特征在于,所述监听单元用于:
通过JavaScript监听网页中图片的onerror事件。
9.一种存储介质,其特征在于,所述存储介质包括存储的程序,其中,在所述程序运行时控制所述存储介质所在设备执行权利要求1至4中任意一项所述的网页数据处理方法。
10.一种处理器,其特征在于,所述处理器用于运行程序,其中,所述程序运行时执行权利要求1至4中任意一项所述的网页数据处理方法。
CN201811162006.3A 2018-09-30 2018-09-30 网页数据处理方法和装置 Pending CN110968810A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201811162006.3A CN110968810A (zh) 2018-09-30 2018-09-30 网页数据处理方法和装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201811162006.3A CN110968810A (zh) 2018-09-30 2018-09-30 网页数据处理方法和装置

Publications (1)

Publication Number Publication Date
CN110968810A true CN110968810A (zh) 2020-04-07

Family

ID=70029379

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201811162006.3A Pending CN110968810A (zh) 2018-09-30 2018-09-30 网页数据处理方法和装置

Country Status (1)

Country Link
CN (1) CN110968810A (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111898152A (zh) * 2020-05-07 2020-11-06 北京五八信息技术有限公司 一种页面展示方法、电子设备及存储介质
CN112016267A (zh) * 2020-08-05 2020-12-01 北京达佳互联信息技术有限公司 一种图标字体处理方法、装置及存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5335323A (en) * 1987-01-05 1994-08-02 Motorola, Inc. Computer human interface with multiapplication display
CN104714802A (zh) * 2015-03-03 2015-06-17 北京京东尚科信息技术有限公司 一种显示html元素的附加信息的方法和装置
CN107766509A (zh) * 2017-10-23 2018-03-06 北京京东尚科信息技术有限公司 一种网页静态备份的方法和装置
CN107818108A (zh) * 2016-09-13 2018-03-20 阿里巴巴集团控股有限公司 一种网页渲染方法、装置及系统

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5335323A (en) * 1987-01-05 1994-08-02 Motorola, Inc. Computer human interface with multiapplication display
CN104714802A (zh) * 2015-03-03 2015-06-17 北京京东尚科信息技术有限公司 一种显示html元素的附加信息的方法和装置
CN107818108A (zh) * 2016-09-13 2018-03-20 阿里巴巴集团控股有限公司 一种网页渲染方法、装置及系统
CN107766509A (zh) * 2017-10-23 2018-03-06 北京京东尚科信息技术有限公司 一种网页静态备份的方法和装置

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
JOKER_YE: ""【前端优化】样式化加载失败的图片"", 《HTTPS://BLOG.CSDN.NET/HJ7JAY/ARTICLE/DETAILS/56275247》 *

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111898152A (zh) * 2020-05-07 2020-11-06 北京五八信息技术有限公司 一种页面展示方法、电子设备及存储介质
CN112016267A (zh) * 2020-08-05 2020-12-01 北京达佳互联信息技术有限公司 一种图标字体处理方法、装置及存储介质

Similar Documents

Publication Publication Date Title
CN105824830B (zh) 一种显示页面的方法、客户端及设备
CN106933887B (zh) 一种数据可视化方法及装置
CN104268229A (zh) 一种基于多进程浏览器的资源获得方法及装置
CN106569805B (zh) 一种画布存储、图形绘制方法和设备
CN110909896A (zh) 一种可视化运维监控方法及装置
CN109857964B (zh) 一种页面操作的热力图绘制方法、装置、存储介质及处理器
CN108460003B (zh) 文本数据的处理方法和装置
CN112579118A (zh) 微服务的配置信息更新方法、装置、系统、介质和设备
CN110968810A (zh) 网页数据处理方法和装置
CN106599045B (zh) 一种请求发送方法及装置
CN109558548B (zh) 一种消除css样式冗余的方法及相关产品
CN110968385A (zh) 比例显示方法和装置
CN110020291B (zh) 网页布局的处理方法及装置
CN111209009B (zh) 内容发布方法及装置、存储介质及电子设备
CN104461310A (zh) 一种页面比对方法及系统
CN110968377B (zh) 界面显示的处理方法及装置
CN109558549B (zh) 一种消除css样式冗余的方法及相关产品
CN110968811A (zh) 显示控制方法和装置
US10394755B2 (en) Information presentation method and apparatus
CN110990799A (zh) 一种反爬虫的数据处理方法、装置、系统及存储介质
CN112580301A (zh) 一种表单校验方法、装置、设备和存储介质
CN109146870B (zh) 模块之间的数据交互方法和装置
CN109948076B (zh) 数据可视化的配置方法及装置
CN107608947B (zh) Html文件处理方法及装置、电子设备
CN109948075B (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
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20200407