网页图片加载方法和装置的制造方法

文档序号:9579307阅读:257来源:国知局
网页图片加载方法和装置的制造方法
【技术领域】
[0001]本发明涉及互联网领域,特别涉及网页图片加载方法和装置。
【背景技术】
[0002]目前,很多网页上都添加了各种图片,以便更加直观地向用户传递各种信息。而众所周知,图片文件往往较大。下载较多的图片会占用较多的流量,特别是在按流量计费的情形下,往往可能会耗费更多的费用。特别是在使用智能手机等移动终端,通过移动通信网络访问网页时,客户对流量更加敏感。
[0003]通常,在网页浏览器加载并显示网页时,一般的流程如下:
[0004]首先,在浏览器地址栏中输入地址后开始加载网页。
[0005]浏览器从网络接收到页面的超文本标记语言(HTML)数据,然后开始解析,并生成文件对象模型(DOM)树,然后根据DOM树对网页进行排版,渲染显示。
[0006]在解析的过程中,每当发现有图片标签(img标签),就发起网络请求来加载图片资源,以便后续在用户滚动网页到该图片所在位置时能显示该图片。
[0007]在上述一般流程中,无论图片位于网页的什么位置,都会被加载。但是如果图片位于一个很长页面的靠后的位置,用户并没有进行向下滚动的操作位于靠后的位置的图片照样被加载。
[0008]这样就存在一个问题:当用户没有向下滚动页面以浏览下面的网页内容的时候,已经加载不需要被显示的图片,导致流量的浪费。
[0009]另外,目前还有一种加载并显示网页的方式,其中,在使用移动通信网络访问网页时,一律不加载图片,直到用户通过点击等方式选择查看图片时,才开始下载该图片。
[0010]这样,可以节省加载不必要的图片所耗费的流量,但是当用户想要查看图片时,需要额外的操作和额外的等待时间,用户体验较差。
[0011]如上所述,在流畅地浏览含有图片的网页与节省下载不必要的图片将耗费的流量之间存在矛盾。
[0012]需要一种网页图片加载方法和装置,使得能够在流畅地浏览含有图片的网页与节省流量之间取得某种平衡。

【发明内容】

[0013]本发明所要解决的一个技术问题是提供一种网页图片加载方法和装置,使得既能够流畅地浏览含有图片的网页,又能够节省下载部分不必要的图片将耗费的流量。
[0014]根据本发明的一个方面,提供了一种网页图片加载方法,包括:响应于网页首次排版完成或响应于屏幕显示范围移动指令,确定图片加载范围内的待加载图片,图片加载范围包括当前屏幕显示范围或当前屏幕显示范围以外预定距离内的预定距离范围;以及加载图片加载范围内的待加载图片。
[0015]优选地,该网页图片加载方法还可以包括:解析所获取的网页源文件以生成网页的DOM(文件对象模型)树;当在解析过程中发现有图片标签时,在记录表中记录与图片标签对应的DOM节点;以及根据图片标签的CSS (层叠样式表)属性进行图片排版。
[0016]优选地,确定图片加载范围内的待加载图片的步骤可以包括:查询记录表中记录的每个DOM节点的排版结果;根据排版结果,判断与DOM节点对应的图片标签所对应的图片的位置是否在图片加载范围内;如果在图片加载范围内,则确定图片为图片加载范围内的待加载图片。
[0017]优选地,确定图片加载范围内的待加载图片的步骤还可以包括:在记录表中删除对图片加载范围内的待加载图片所对应的DOM节点的记录。
[0018]优选地,预定距离可以是基于一次屏幕显示范围移动指令将使屏幕显示范围移动的距离。
[0019]根据本发明的另一个方面,提供了一种网页图片加载装置,包括:图片确定装置,用于响应于网页首次排版完成或响应于屏幕显示范围移动指令,确定图片加载范围内的待加载图片,图片加载范围包括当前屏幕显示范围或当前屏幕显示范围以外预定距离内的预定距离范围;以及图片加载装置,用于加载图片加载范围内的待加载图片。
[0020]优选地,该网页图片加载装置还可以包括:解析装置,用于解析所获取的网页源文件以生成网页的DOM树;记录装置,用于当在解析过程中发现有图片标签时,在记录表中记录与图片标签对应的DOM节点;以及排版装置,用于根据图片标签的CSS属性进行图片排版。
[0021]优选地,图片确定装置可以包括:查询装置,用于查询记录表中记录的每个DOM节点的排版结果;判断装置,用于根据排版结果,判断与DOM节点对应的图片标签所对应的图片的位置是否在图片加载范围内;确定装置,用于在判断装置判定位置在图片加载范围内的情况下,确定图片为图片加载范围内的待加载图片。
[0022]优选地,图片确定装置还可以包括:删除装置,用于在记录表中删除对图片加载范围内的待加载图片所对应的DOM节点的记录。
[0023]优选地,预定距离可以是基于一次屏幕显示范围移动指令将使屏幕显示范围移动的距离。
[0024]通过使用本发明的网页图片加载方法和装置,在初始加载网页时没有加载全部图片以节省流量的情况下,在浏览过程中适应性地自动加载了部分图片,以备用户浏览,实现了在流畅地浏览含有图片的网页与节省流量之间的良好平衡。
【附图说明】
[0025]图1是根据本发明的网页图片加载方法的示意性流程图。
[0026]图2是在根据本发明的网页图片加载方法中可以采用的对网页源文件进行解析和排版的流程图。
[0027]图3是可以用来确定图片加载范围内的待加载图片的一种方式的流程图。
[0028]图4是根据本发明一个实施例的网页图片加载装置的示意性方框图。
[0029]图5是根据本发明另一个实施例的网页图片加载装置的示意性方框图。
[0030]图6是图片确定装置的示意性方框图。
【具体实施方式】
[0031]下面参考附图1-6来详细描述根据本发明的网页图片加载方法和装置。
[0032]为避免掩蔽本发明的主要技术构思,这里没有描述一些细节,也没有描述一些网页图片加载方法和装置以及一般的网页加载方法和装置中常用的常规步骤和装置。
[0033]图1的示意性流程图示出了本发明的网页图片加载方法。
[0034]用户在浏览器地址栏中输入地址,或者通过在别的页面点击超链接,开始请求访问网页。特别是在使用手机等移动通信终端访问网页时,很多网页的内容往往多于屏幕一次能够显示的内容。
[0035]在加载网页源文件(例如html)文件时,网页中至少部分图片并没有立即加载,以便避免下载不必要的图片,节省流量。
[0036]这里,有可能完全没有下载任何图片,也有可能只下载了网页的首屏的图片即第一屏要显示的图片,或者也有可能只下载了字节数小于预定数值的图片。
[0037]文字的字节数较少,因此,可以下载全部的文字内容。或者,也可以根据需要或设置而下载预定部分的文字内容。
[0038]在步骤S200,响应于网页首次排版完成,或者响应于屏幕显示范围移动指令,确定图片加载范围内的待加载图片。图片加载范围包括当前屏幕显示范围或当前屏幕显示范围以外预定距离内的预定距离范围。
[0039]然后,在步骤S300,加载图片加载t[!围内的待加载图片。
[0040]下面对上述步骤进行说明。
[0041]当下载了网页源文件之后,网页浏览器,特别是智能手机的网页浏览器会对网页内容重新排版,以适应例如智能手机的屏幕。
[0042]一方面,当网页首次排版完成时,屏幕上将显示第一屏的内容。如果在第一屏的内容中有待加载的图片,则可以认
当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1