网页商品的动态加载方法与系统与流程

本发明涉及互联网技术领域，特别涉及一种网页商品的动态加载方法与系统。

背景技术

传统网页上商品的加载，都是随着浏览器的访问，将所有元素从服务器调用呈现在浏览器上，这在网络带宽不足或者网速较慢的情况下，容易出现网页空白或者卡顿，造成用户体验不佳的情况。

技术实现要素：

本发明的实施方式旨在至少解决现有技术中存在的技术问题之一。为此，本发明的实施方式需要提供一种网页商品的动态加载方法与系统。

本发明实施方式的网页商品的动态加载方法，其特征在于，包括：

步骤1，接收用户对在线电子商城进行商品浏览的访问请求；

步骤2，根据访问请求在网页的第一区域加载商品信息进行显示；

步骤3，接收用户对在线电子商城进行商品浏览的滑动请求；

步骤4，根据滑动请求确定网页的第二区域已经加载；

步骤5，在已加载的第二区域加载商品信息进行显示。

一种实施方式中，步骤1包括：接收用户通过移动终端或pc对在线电子商城进行商品浏览的访问请求。

一种实施方式中，滑动请求包括向上滑动请求和向下滑动请求。

本发明还提出一种网页商品的动态加载系统，包括：

第一接收模块，用于接收用户对在线电子商城进行商品浏览的访问请求；

第一显示模块，用于根据访问请求在网页的第一区域加载商品信息进行显示；

第二接收模块，用于接收用户对在线电子商城进行商品浏览的滑动请求；

确定模块，用于根据滑动请求确定网页的第二区域已经加载；

第二显示模块，用于在已加载的第二区域加载商品信息进行显示。

一种实施方式中，第一接收模块，具体用于接收用户通过移动终端或pc对在线电子商城进行商品浏览的访问请求。

一种实施方式中，滑动请求包括向上滑动请求和向下滑动请求。

本发明实施方式的网页商品的动态加载方法与系统，将网页分成多个区域，在接收到用户的访问请求时只显示第一区域，在用户有进一步的交互动作后根据加载的区域在进行商品信息的加载，通过分批次分区域来控制浏览器的数据传输量，解决网页空白或者卡顿等用户体验不佳的情况。

本发明的附加方面的优点将在下面的描述中部分给出，部分将从下面的描述中变得明显，或通过本发明的实践了解到。

附图说明

本发明的实施方式的上述和/或附加的方面和优点从结合下面附图对实施方式的描述中将变得明显和容易理解，其中：

图1是本发明实施方式的网页商品的动态加载方法的流程示意图；

图2是本发明实施方式的网页商品的动态加载系统的组成示意图。

具体实施方式

下面详细描述本发明的实施方式，实施方式的示例在附图中示出，其中相同或类似的标号自始至终表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施方式是示例性的，仅可用于解释本发明的实施方式，而不能理解为对本发明的实施方式的限制。

请参阅图1和图2，图1是本发明实施方式的网页商品的动态加载方法的流程示意图；图2是本发明实施方式的网页商品的动态加载系统的流程示意图。

本发明实施方式的网页商品的动态加载方法，包括：

步骤1，接收用户对在线电子商城进行商品浏览的访问请求；

步骤2，根据访问请求在网页的第一区域加载商品信息进行显示；

步骤3，接收用户对在线电子商城进行商品浏览的滑动请求；

步骤4，根据滑动请求确定网页的第二区域已经加载；

步骤5，在已加载的第二区域加载商品信息进行显示。

本发明实施方式还同时提出一种网页商品的动态加载系统，包括：接收模块、显示模块和确定模块。

其中，第一接收模块，用于接收用户对在线电子商城进行商品浏览的访问请求。

第一显示模块，用于根据访问请求在网页的第一区域加载商品信息进行显示。

第二接收模块，用于接收用户对在线电子商城进行商品浏览的滑动请求。

确定模块，用于根据滑动请求确定网页的第二区域已经加载。

第二显示模块，用于在已加载的第二区域加载商品信息进行显示。

在该实施方式中，网页商品的动态加载方法以网页商品的动态加载系统作为步骤的执行对象，或者网页商品的动态加载方法以网页商品的动态加载系统的各个模块作为步骤的执行对象。具体地，步骤1以第一接收模块作为步骤的执行对象，步骤2以第一显示模块作为步骤的执行对象，步骤3以第二接收模块作为步骤的执行对象，步骤4以确定模块作为步骤的执行对象，步骤5以第二显示模块作为步骤的执行对象。

在步骤1中，第一接收模块接收用户对在线电子商城进行商品浏览的访问请求。用户可以通过浏览器中输入在线电子商城的网址或者点击打开在线电子商城对应的app来实现对在线电子商城的访问，第一接收模块则接收该访问请求。

即，进一步地，步骤1包括：第一接收模块接收用户通过移动终端或pc对在线电子商城进行商品浏览的访问请求。移动终端上的访问可以增加用户访问的便捷度，pc端的访问可以适应用户的习惯，不需要用户重新适应。

在步骤2中，第一显示模块根据访问请求在网页的第一区域加载商品信息进行显示。在线电子商城的网页中，可以将首次显示在屏幕的可视区域作为第一区域，即网页包括多个区域，用户在首次加载时第一眼看得到的区域是第一区域，其他区域可能需要通过进一步的交互才能够显示。这样的情况下，通过网页区域的划分，可以控制首次加载的商品信息。

在步骤3中，第二接收模块接收用户对在线电子商城进行商品浏览的滑动请求。用户在在线电子商城进行商品浏览时，可以通过鼠标滚轮滑动或者手指滑动等方式，来请求查看在线电子商城中还没显示的其他商品信息，第二接收模块则接收该滑动请求，以便进行后续处理。

进一步地，滑动请求包括向上滑动请求和向下滑动请求。通过区分不同方向的滑动请求，可以将用户的浏览行为确定为向上滑动或者向下滑动，通过不同方向的区分能实现不同区域的切换，即通过向上滑动或者向下滑动的交互在第一区域之外加载其他区域。

在步骤4中，确定模块根据滑动请求确定网页的第二区域已经加载。用户通过滑动的方式浏览在线电子商城的商品时，可能是随意滑动，也可能是有意识的滑动。第二区域是相对于第一区域而言，表示原本未加载的区域。所以对于这种情况需要进行一下区分，具体可以根据用户滑动到第二区域的停留时间判断，例如停留1s以上则开始加载第二区域，确定模块根据加载后的情况确定第二区域已经加载。

在步骤5中，第二显示模块在已加载的第二区域加载商品信息进行显示。即通过区域的划分和商品信息的划分，在用户通过交互浏览到新的区域后加载商品信息，避免网络情况不好时一次性在整个网页进行商品信息的加载造成的卡顿或者网页显示空白。

本发明实施方式的网页商品的动态加载方法与系统，将网页分成多个区域，在接收到用户的访问请求时只显示第一区域，在用户有进一步的交互动作后根据加载的区域在进行商品信息的加载，通过分批次分区域来控制浏览器的数据传输量，解决网页空白或者卡顿等用户体验不佳的情况。

在本发明的实施方式的描述中，需要理解的是，术语“中心”、“纵向”、“横向”、“长度”、“宽度”、“厚度”、“上”、“下”、“前”、“后”、“左”、“右”、“竖直”、“水平”、“顶”、“底”、“内”、“外”、“顺时针”、“逆时针”等指示的方位或位置关系为基于附图所示的方位或位置关系，仅是为了便于描述本发明的实施方式和简化描述，而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本发明的实施方式的限制。此外，术语“第一”、“第二”仅用于描述目的，而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或者隐含地包括一个或者更多个所述特征。在本发明的实施方式的描述中，“多个”的含义是两个或两个以上，除非另有明确具体的限定。

在本发明的实施方式的描述中，需要说明的是，除非另有明确的规定和限定，术语“安装”、“相连”、“连接”应做广义理解，例如，可以是固定连接，也可以是可拆卸连接，或一体地连接；可以是机械连接，也可以是电连接或可以相互通讯；可以是直接相连，也可以通过中间媒介间接相连，可以是两个元件内部的连通或两个元件的相互作用关系。对于本领域的普通技术人员而言，可以根据具体情况理解上述术语在本发明的实施方式中的具体含义。

在本发明的实施方式中，除非另有明确的规定和限定，第一特征在第二特征之“上”或之“下”可以包括第一和第二特征直接接触，也可以包括第一和第二特征不是直接接触而是通过它们之间的另外的特征接触。而且，第一特征在第二特征“之上”、“上方”和“上面”包括第一特征在第二特征正上方和斜上方，或仅仅表示第一特征水平高度高于第二特征。第一特征在第二特征“之下”、“下方”和“下面”包括第一特征在第二特征正下方和斜下方，或仅仅表示第一特征水平高度小于第二特征。

下文的公开提供了许多不同的实施方式或例子用来实现本发明的实施方式的不同结构。为了简化本发明的实施方式的公开，下文中对特定例子的部件和设置进行描述。当然，它们仅仅为示例，并且目的不在于限制本发明。此外，本发明的实施方式可以在不同例子中重复参考数字和/或参考字母，这种重复是为了简化和清楚的目的，其本身不指示所讨论各种实施方式和/或设置之间的关系。此外，本发明的实施方式提供了的各种特定的工艺和材料的例子，但是本领域普通技术人员可以意识到其他工艺的应用和/或其他材料的使用。

在本说明书的描述中，参考术语“一个实施方式”、“一些实施方式”、“示意性实施方式”、“示例”、“具体示例”或“一些示例”等的描述意指结合所述实施方式或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施方式或示例中。在本说明书中，对上述术语的示意性表述不一定指的是相同的实施方式或示例。而且，描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施方式或示例中以合适的方式结合。

流程图中或在此以其他方式描述的任何过程或方法描述可以被理解为，表示包括一个或更多个用于实现特定逻辑功能或过程的步骤的可执行指令的代码的模块、片段或部分，并且本发明的优选实施方式的范围包括另外的实现，其中可以不按所示出或讨论的顺序，包括根据所涉及的功能按基本同时的方式或按相反的顺序，来执行功能，这应被本发明的实施例所属技术领域的技术人员所理解。

在流程图中表示或在此以其他方式描述的逻辑和/或步骤，例如，可以被认为是用于实现逻辑功能的可执行指令的定序列表，可以具体实现在任何计算机可读介质中，以供指令执行系统、装置或设备(如基于计算机的系统、包括处理模块的系统或其他可以从指令执行系统、装置或设备取指令并执行指令的系统)使用，或结合这些指令执行系统、装置或设备而使用。就本说明书而言，″计算机可读介质″可以是任何可以包含、存储、通信、传播或传输程序以供指令执行系统、装置或设备或结合这些指令执行系统、装置或设备而使用的装置。计算机可读介质的更具体的示例(非穷尽性列表)包括以下：具有一个或多个布线的电连接部(电子装置)，便携式计算机盘盒(磁装置)，随机存取存储器(ram)，只读存储器(rom)，可擦除可编辑只读存储器(eprom或闪速存储器)，光纤装置，以及便携式光盘只读存储器(cdrom)。另外，计算机可读介质甚至可以是可在其上打印所述程序的纸或其他合适的介质，因为可以例如通过对纸或其他介质进行光学扫描，接着进行编辑、解译或必要时以其他合适方式进行处理来以电子方式获得所述程序，然后将其存储在计算机存储器中。

应当理解，本发明的实施方式的各部分可以用硬件、软件、固件或它们的组合来实现。在上述实施方式中，多个步骤或方法可以用存储在存储器中且由合适的指令执行系统执行的软件或固件来实现。例如，如果用硬件来实现，和在另一实施方式中一样，可用本领域公知的下列技术中的任一项或他们的组合来实现：具有用于对数据信号实现逻辑功能的逻辑门电路的离散逻辑电路，具有合适的组合逻辑门电路的专用集成电路，可编程门阵列(pga)，现场可编程门阵列(fpga)等。

本技术领域的普通技术人员可以理解实现上述实施例方法携带的全部或部分步骤是可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，该程序在执行时，包括方法实施例的步骤之一或其组合。

此外，在本发明的各个实施例中的各功能单元可以集成在一个处理模块中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个模块中。上述集成的模块既可以采用硬件的形式实现，也可以采用软件功能模块的形式实现。所述集成的模块如果以软件功能模块的形式实现并作为独立的产品销售或使用时，也可以存储在一个计算机可读取存储介质中。

上述提到的存储介质可以是只读存储器，磁盘或光盘等。

尽管上面已经示出和描述了本发明的实施例，可以理解的是，上述实施例是示例性的，不能理解为对本发明的限制，本领域的普通技术人员在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。