CN106097072B - 一种商品信息的对比方法、装置与终端设备 - Google Patents

Abstract

本发明公开了一种商品信息的对比方法、装置以及终端设备，涉及电子商务技术领域，其中的方法包括：接收商品信息并将商品信息在商品展示页面上显示；对商品展示页面中的事件进行检测，根据事件确定在商品展示页面上选中的待比对商品；获取待比对商品的特征信息并将特征信息发送到服务器；接收服务器返回的待比对商品的商品数据并在商品对比页面上显示。本发明的方法、装置与终端设备，可直接在商品展示页面中进行发起商品信息对比的操作，不需要打开商品详情页，无需反复进入详情页来操作，减少了计算量，降低了对系统资源的占用，减少了网络的负荷，也降低了CPU的使用率，提高了用户体验。

Description

一种商品信息的对比方法、装置与终端设备

技术领域

本发明涉及电子商务技术领域，尤其涉及一种商品信息的对比方法、装置与终端设备。

背景技术

随着互联网和电子商务的迅猛发展，每天都有大量的商品交易在电商网站上完成，各大电商平台的商品种类、数量增长很快。在购物过程中，用户往往会通过关键词搜索需要的商品，如搜索关键词为＂手机＂的商品，服务端返回各种品牌的手机到前端进行显示，用户可以通过对比商品各项参数，结合自己的需求挑选合适的商品。在此过程中，用户会通过各种方式来对比商品的各项参数信息，例如，价格、配置参数、功能等，因此，对用户提供商品信息的对比操作功能显得尤为重要。

目前的电子商务平台网站提供的商品信息对比的功能一般为：搜索指定的商品，获得商品搜索结果数据；打开某一个商品，在商品详情页中选择＂对比＂按钮，将商品加入到待对比列表；在待对比列表中再次点击＂对比＂按钮，进入商品信息对比页。在需要进行比对时，进入商品详情后将商品加入到待对比列表，操作繁琐，需要反复操作才能完成商品的比对。用户只有打开商品详情页，才能进行商品信息对比，用户无法在商品搜索列表面进行商品信息的对比操作，用户体验差，并且由于需要频繁进入商品详情页面，需要对服务器进行频繁的网页请求，占用较大的后台服务器资源并且网络传输的负荷大，增加了运营成本和使用成本。

发明内容

有鉴于此，本发明要解决的一个技术问题是提供一种商品信息的对比方法、装置与终端设备。

根据本发明的一个方面，提供一种商品信息的对比方法，包括：对所述商品展示页面中的事件进行检测，根据所述事件确定在所述商品展示页面上选中的待比对商品；其中，所述商品展示页面显示接收到的商品信息；获取所述待比对商品的特征信息并将所述特征信息发送到服务器；接收所述服务器返回的所述待比对商品的商品数据并在商品对比页面上显示。

可选地，根据所述事件确定在所述商品展示页面上选中的待比对商品包括：根据所述事件确定在所述商品展示页面上选择的对比商品区域；确定此对比商品区域内的多个商品元素所对应的商品为所述待比对商品。

可选地，所述根据所述事件确定在所述商品展示页面上选择的对比商品区域包括：当监听到第一选择开始事件时，记录与所述第一选择开始事件对应的第一坐标；当监听到第一选择结束事件时，记录与所述第一选择结束事件对应的第二坐标；根据所述第一坐标和所述第二坐标确定所述对比商品区域。

可选地，确定在所述商品展示页面上选中的第一商品元素；当所述商品展示页面上的焦点区域位于第二商品元素上方、且满足选定条件时，则将所述第一商品元素和所述第二商品元素确定为所述待比对商品。

可选地，当判断开始拖拽所述第一商品元素时添加与所述第一商品元素相对应的参照商品元素，并使所述参照商品元素跟随所述拖拽的轨迹进行显示；当所述参照商品元素移动到所述第二商品元素上方、且满足选定条件，则将所述第一商品元素和所述第二商品元素确定为所述待比对商品。

可选地，所述添加与第一商品元素相对应的参照商品元素包括：添加商品参照层；获取所述第一商品元素的显示内容和级联样式表信息；依据所述显示内容和级联样式表信息在所述商品参照层中创建与参照商品元素；其中，所述商品参照层位于顶层，所述商品参照层覆盖所述商品展示页面。

可选地，使所述参照商品元素跟随所述拖拽的轨迹进行显示包括：当监听到选中第一商品元素的第二选择开始事件时，记录与所述第二选择开始事件对应的第三坐标；监听与所述参照商品元素的移动对应的移动事件，基于所述移动事件实时获取所述参照商品元素的偏移量；基于所述第三坐标和偏移量实时确定第四坐标，使所述参照商品元素的显示位置基于所述第四坐标而变换。

可选地，基于移动事件确定所述参照商品元素移动到所述第二商品元素上方，并且开始计时；当判断计时的时长超过预设的时长阈值时，则确定所述第二商品元素所对应的商品为所述待比对商品；或当所述参照商品元素移动到所述第二商品元素上方时监听到第二选择结束事件，则确定所述第二商品元素为待比对商品；其中，当监听到第二选择结束事件时，当监听到第二选择结束事件时，隐藏所述商品参照层。

可选地，获取所述待比对商品的特征信息并将所述特征信息发送到服务器包括：获取预先存储的所述待比对商品的商品信息，并从此商品信息中提取所述特征信息；在所述商品展示页面上提供选择是否进行比对的功能，基于输入的选择指令将所述待比对商品的特征信息发送到所述服务器；其中，所述特征信息为商品名称和/或商品的标识号。

可选地，所述接收商品信息并将所述商品信息在商品展示页面上显示包括：接收所述服务器发送的商品检索结果，其中，所述商品检索结果包括：HTML文件、CSS文件；基于所述HTML文件、所述级联样式表信息生成所述商品展示页面，确定在所述商品展示页面上显示的商品元素的坐标、并将所述HTML文件中携带的所述商品信息进行缓存。

根据本发明的另一方面，提供一种商品信息的对比装置，包括：对比商品确认模块，用于对所述商品展示页面中的事件进行检测，根据所述事件确定在所述商品展示页面上选中的待比对商品；其中，所述商品展示页面显示接收到的商品信息；对比数据发送模块，用于获取所述待比对商品的特征信息并将所述特征信息发送到服务器；对比商品显示模块，用于接收所述服务器返回的所述待比对商品的商品数据并在商品对比页面上显示。

可选地，所述对比商品确认模块，包括：事件检测单元，用于对所述事件进行检测；对比区域确认单元，根据所述事件确定在所述商品展示页面上选择的对比商品区域；对比商品选定单元，用于确定此对比商品区域内的多个商品元素所对应的商品为所述待比对商品。

可选地，所述事件检测单元，还用于当监听到第一选择开始事件时，记录与所述第一选择开始事件对应的第一坐标；当监听到第一选择结束事件时，记录与所述第一选择结束事件对应的第二坐标；所述对比商品选定单元，还用于根据所述第一坐标和所述第二坐标确定所述对比商品区域。

可选地，所述对比商品确认模块，包括：选中商品确定单元，用于确定在所述商品展示页面上选中的第一商品元素，当所述商品展示页面上的焦点区域位于第二商品元素上、且满足选定条件时，则将所述第一商品元素和所述第二商品元素确定为所述待比对商品。

可选地，所述对比商品确认模块，包括：拖动图片生成单元，用于当判断开始拖拽所述第一商品元素时添加商品参照层，并在所述商品参照层上复制与第一商品元素相对应的参照商品元素；拖动图片显示单元，用于使所述参照商品元素跟随所述拖拽的轨迹进行显示；所述选中商品确定单元，用于当所述参照商品元素移动到所述第二商品元素上方、且满足选定条件，则将所述第一商品元素和所述第二商品元素确定为所述待比对商品。

可选地，所述拖动图片生成单元，还用于添加商品参照层，获取所述第一商品元素的显示内容和级联样式表信息，依据所述显示内容和级联样式表信息在所述商品参照层中创建与第一商品元素相对应的参照商品元素；其中，所述商品参照层位于顶层，所述商品参照层覆盖所述商品展示页面。

可选地，所述拖动图片显示单元，包括：初始坐标记录子单元，用于当监听到选中第一商品元素的第二选择开始事件时，记录与所述第二选择开始事件对应的第三坐标；偏移量计算子单元，用于监听与所述参照商品元素的移动对应的移动事件，基于所述移动事件实时获取所述参照商品元素的偏移量；显示坐标确定子单元，用于基于所述第三坐标和偏移量实时确定第四坐标，以使所述参照商品元素的显示位置基于所述第四坐标而变换。

可选地，所述选中商品确定单元，还用于基于移动事件确定所述参照商品元素移动到所述第二商品元素上方，并且开始计时；当判断计时的时长超过预设的时长阈值时，则确定所述第二商品元素所对应的商品为所述待比对商品；或当所述参照商品元素移动到所述第二商品元素上方时监听到第二选择结束事件，则确定所述第二商品元素为待比对商品；所述对比商品确认模块，还包括：拖动图片隐藏单元，用于当监听到第二选择结束事件时，隐藏所述商品参照层。

可选地，所述对比数据发送模块，包括：特征信息获取单元，用于获取预先存储的所述待比对商品的商品信息，并从此商品信息中提取所述特征信息；特征信息发送单元，用于在所述商品展示页面上提供选择是否进行比对的功能，基于输入的选择指令将所述待比对商品的特征信息发送到所述服务器；其中，所述特征信息为商品名称和/或商品的标识号。

可选地，还包括商品显示处理模块，其中，所述商品显示处理模块包括：检索结果接收单元，用于接收所述服务器发送的商品检索结果，其中，所述商品检索结果包括：HTML文件、CSS文件；显示布局单元，用于基于所述HTML文件、所述级联样式表信息生成所述商品展示页面，确定在所述商品展示页面上显示的商品元素的坐标、并将所述HTML文件中携带的所述商品信息进行缓存。

根据本发明的又一方面，提供一种终端设备，包括：如上所述的商品信息的对比装置。

根据本发明的再一方面，提供一种商品信息的对比装置，包括：存储器；以及耦接至所述存储器的处理器，所述处理器被配置为基于存储在所述存储器中的指令，执行如上所述的商品信息的对比方法。

本发明中的商品信息的对比方法、装置以及终端设备，可直接在商品展示页面中进行发起商品信息对比的操作，降低了对系统资源的占用，减少了网络的负荷，提高用户的使用体验。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作一简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1为根据本发明的商品信息的对比方法的一个实施例的流程示意图；

图2为商品展示页面上显示商品的示意图；

图3为根据本发明的商品信息的对比装置的一个实施例的模块示意图；

图4为根据本发明的商品信息的对比装置的一个实施例中的对比商品确认模块的模块示意图；

图5为根据本发明的商品信息的对比装置的一个实施例中的拖动图片显示单元的模块示意图；

图6为根据本发明的商品信息的对比装置的一个实施例中的对比数据发送模块的模块示意图；

图7为根据本发明的商品信息的对比装置的一个实施例中的商品显示处理模块的模块示意图；

图8为根据本发明的商品信息的对比装置的另一个实施例的模块示意图。

具体实施方式

下面参照附图对本发明进行更全面的描述，其中说明本发明的示例性实施例。下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。下面结合各个图和实施例对本发明的技术方案进行多方面的描述。

下文中的“第一”、“第二”等仅用于描述上相区别，并没有其它特殊的含义。

图1为根据本发明的商品信息的对比方法的一个实施例的流程示意图，如图1所示：

步骤101，接收商品信息并将商品信息在商品展示页面上显示。

例如，用户在手机或PC中的浏览器检索页面上输入关键词并提交，服务器将搜索到商品信息发送到手机或PC，商品信息包括：商品名称、商品的ID(标识号)、价格、促销信息、图片等，手机或PC中的浏览器生成商品展示页面向用户呈现商品。

步骤102，对商品展示页面中的事件进行检测，根据事件确定在商品展示页面上选中的待比对商品。

对商品展示页面中用户输入的事件进行检测，事件包括：鼠标事件、键盘事件或触摸屏的触摸事件等。

步骤103，获取待比对商品的特征信息并将特征信息发送到服务器。

当判断用户在商品展示页面上选中了待比对商品，可以生成待对比商品列表，将用户选中的一个或多个商品加入待对比列表中，存储用户选中的商品信息。从此商品信息中提取特征信息，用于生成数据对报告。特征信息为商品名称和/或商品的ID，例如，获取列表中各商品的ID，向服务器发送请求，将待对比列表中所有的商品的唯一标示(商品的ID)作为请求参数，发送到指定的服务器。

步骤104，接收服务器返回的待比对商品的商品数据并在商品对比页面上显示。

例如，服务端根据各商品的ID，生成待比对商品各项参数的信息对比数据报告，并将生成的对比数据报告下发给用户的在手机或PC，生成商品对比页面显示对比数据报告。

上述实施例中的商品信息的对比方法，可直接在商品展示页面中进行发起商品信息对比的操作，不需要打开商品详情页，即可实现商品信息的快速对比的操作，提高了用户体验，减少了系统的负荷。

在一个实施例中，用户在手机或PC中的浏览器向服务器发送携带有商品关键词的商品检索指令，浏览器接收服务器返回的商品检索结果，商品检索结果包括：HTML文件、CSS文件和商品图片等。HTML文件中携带有商品信息，包括：商品名称、商品的ID、价格、促销信息等。解析HTML文件并将商品信息存储在内存中。解析CSS文件生成样式表。

基于HTML文件、样式表和商品图片生成商品展示页面，并确定商品图片在商品展示页面上的坐标，根据样式表确定商品展示页面的布局类型，按照布局类型确定商品展示页面的分栏的数量和各分栏宽度比例，将商品信息显示在分栏中，并确定分栏中的商品元素的坐标。

在浏览器中，通过提供的HTML DOM(Document Object Model，文档对象模型)结合HTML(Hypertext Markup Language Source，超文本标记语言)脚本技术(JavaScript等)，可以实现对页面中指定视图的选中、框选、拖动等功能。

在商品展示页面上形成多个商品显示区域，形成商品显示列表，通过脚本语言JavaScript创建HTML文件中的所有商品的DIV节点，在对应的商品显示区域中显示商品信息，如图2所示。在商品图片显示区域中显示的商品信息(商品的DIV节点)，即为本发明中的商品元素，包括图片、价格、促销信息等。

浏览器从HTML文件中解析出DOM Tree，从CSS(Cascading Style Sheet，级联样式表)中解析出级联样式表对应的样式结构体后，构建出Render Tree(呈现树)，然后浏览器根据Render Tree绘制页面进行显示。在构建过程中，浏览器会将文档对象模型树中的商品元素逐个放入级联样式表对应的样式结构体中相应的级联样式表位置，然后进行构建。文档对象模型树主要决定商品元素的呈现内容，包括图片、价格、优惠信息等，级联样式表对应的样式结构体主要决定商品元素呈现的位置。

对商品展示页面上的商品元素的坐标进行设置，可将当前页面看作以左上顶角为原点，x,y为轴的坐标系(容器)，以Flexbox布局或九宫图等方式进行排列，将所有的商品数据展示到页面，根据服务器下发的商品图片尺寸的大小，计算出在容器中的宽度和高度，并设定距离容器顶部(top)的和左边距(left)的大小，以此类推，计算出所有数据在页面的位置。例如，商品A的位置可以用style＝”width:80,height:90,left:10,top:20,position:absolute”的方式来进行描述.每个商品信息都会有sytle描述信息,其中的position:absolute，该属性标示为绝对定位方式。

可以通过脚本对商品展示页面添加事件，当监听到用户的输入事件时，可以进行相应的操作。输入事件可以为鼠标事件、触摸屏事件、键盘事件等。可以使用框选的方法在商品展示页面上选择商品，根据事件确定在商品展示页面上选择的对比商品区域，确定此对比商品区域内的多个商品元素所对应的商品为待比对商品。

在一个实施例中，当监听到第一选择开始事件时，记录与第一选择开始事件对应的第一坐标，当监听到第一选择结束事件时，记录与第一选择结束事件对应的第二坐标。将以第一坐标和第二坐标作为对定点的矩形框作为对比商品区域，确定全部或部分落入对比商品区域中的多个商品元素，将此多个商品元素对应的商品作为待比对商品。

第一选择开始事件、第一选择结束事件可以有多种。例如，按下鼠标事件onmousedown为第一选择开始事件，松开鼠标事件onmouseup为第一选择结束事件。当用户按下鼠标触发onmousedown事件时，记录按下时的坐标点a(x,y)，监听移动鼠标onmousdown事件，记录点击鼠标时的坐标a(x,y),并通过监听onmousemove事件，实时获取滚动的轨迹，当用户松开鼠标触发onmouseup事件时，记录松开鼠标的坐标点b(x,y),通过a点和b点的坐标，可以确定一个矩形框，通过计算获取在矩形框内的所有商品，被视为选中的商品。

在一个实施例中，确定在商品展示页面上选中的第一商品元素，当商品展示页面上的焦点区域位于第二商品元素上方、且满足选定条件时，则将第一商品元素和第二商品元素确定为所述待比对商品。

例如，用户也可以在商品展示页面，点击鼠标选中商品A，并将商品A拖动至商品B的位置，商品A悬停在商品B的上方或商品A的显示框与商品B的显示区存在相互重叠，选择待对比的商品。或者，用户点击鼠标选中商品A后，通过鼠标点击商品B选择待对比的商品等。本发明的中的焦点区域为鼠标的点击区域、商品拖动时形成的视图显示区域、手指在触摸屏上点击的区域等。选定条件可以为：松开鼠标、点击鼠标、停留超过时间阈值等。

确定在商品展示页面上选中的第一商品元素，当判断开始拖拽第一商品元素时添加商品参照层，并在商品参照层上复制与第一商品元素相对应的参照商品元素，并使参照商品元素跟随拖拽的轨迹进行显示；当判断参照商品元素在商品展示页面上的第二商品元素上方悬停的时长超过预设的时长阈值、或者当参照商品元素位于第二商品元素上方时监听到第二选择结束事件，则确定第二商品元素为待比对商品。

获取第一商品元素的显示内容和级联样式表信息，商品元素包括在商品展示页面上显示的图片、价格、优惠信息等。获取的第一商品元素的显示内容可以为图片、价格、优惠信息中的一个或多个。依据显示内容和级联样式表信息在商品参照层中创建与第一商品元素相对应的参照商品元素。商品参照层位于顶层，商品参照层覆盖商品展示页面。

当监听到选中第一商品元素的第二选择开始事件时，记录与第二选择开始事件对应的第三坐标。监听与参照商品元素的移动对应的移动事件，基于移动事件实时获取参照商品元素的偏移量。基于第三坐标和偏移量实时确定第四坐标，使参照商品元素的显示位置基于第四坐标而变换。

第二选择开始事件、移动事件以及第二选择结束事件可以有多种。例如，按下鼠标事件onmousedown为第二选择开始事件，松开鼠标事件onmouseup为第二选择结束事件，移动鼠标事件onmousemove为移动事件。在拖动商品A时，按下鼠标触发onmousedown事件，记录按下时的坐标点a(x,y)，移动鼠标触发onmousemove事件，记录移动的轨迹,计算鼠标的偏移量，并根据偏移量，计算出商品参照层上与商品A对应的商品A1的相对位置的坐标。

在侦听到鼠标的拖拽动作开始时，激活添加覆盖于整个拖拽区域的商品参照层，然后在商品参照层中创建被拖拽的第一商品元素对应的参照商品元素。商品参照层对应在文档对象模型树中的位置，在各元素对应在文档对象模型树中的各位置之后。

鼠标拖动时，是拖动的商品参照层中的参照商品元素，并没有拖动原来位置的第一商品元素，只要计算商品参照层中第二图片元素的位置即可。基于移动事件确定参照商品元素移动到第二商品元素上方，并且开始计时；当判断计时的时长超过预设的时长阈值时，则确定第二商品元素所对应的商品为待比对商品。当监听到第二选择结束事件时，隐藏商品参照层。

如图2所示，通过鼠标左键点击某一商品实现单选操作，通过鼠标选中商品A后，做拖动操作时，商品参照层可随着鼠标的拖动而移动，拖动商品A移动到商品B的上方，即可实现商品对比的操作。通过脚本在商品B的显示区域内添加事件onmouseover，该事件在鼠标移动到商品B的显示区域内时触发。

当将选中的商品A移动到商品B的上面时，悬停一定时间，如2s后，则商品B为选中的待比对商品。也可以通过检测鼠标拖动商品的轨迹及悬停到相应商品的上方时、或与其它商品有重合部分时，松开鼠标时可以获取选中商品。

可以在文档对象模型树中最后一个元素之后添加一个商品参照层结构，预先在商品展示页面对应的文档对象模型树中，最后一个元素的位置之后，添加商品参照层，在文档对象模型树的主干尾端添加对应商品参照层的div块，即为使用DIV标签确定的单元，并将其属性设置为顶层div。

可以在生成页面时预先存储的待比对商品的商品信息，例如，存储在特定的内存中。当判断用户选定比对商品后，从商品信息中提取特征信息作为参数，发送请求到指定服务器，由服务端生成详细的商品参数对比报告，返回给用户。

当判断用户选定比对商品后，可以在商品展示页面上提供选择是否进行比对的功能，例如，提供弹出框，用户需要选择是否进行比对。如果用户确定需要进行比对，则将待比对商品的特征信息发送到服务器。

上述实施例中的商品信息的对比方法，可直接在商品展示页面中进行发起商品信息对比的操作，不需要打开商品详情页，无需反复进入详情页来操作，减少了计算量，降低了对系统资源的占用，减少了网络的负荷，也降低了CPU的使用率。

如图3所示，本发明提供一种商品信息的对比装置30包括：商品显示处理模块31、对比商品确认模块32、对比数据发送模块33和对比商品显示模块34。商品显示处理模块31接收商品信息并将商品信息在商品展示页面上显示。

对比商品确认模块32对商品展示页面中的事件进行检测，根据事件确定在商品展示页面上选中的待比对商品。对比数据发送模块33获取待比对商品的特征信息并将特征信息发送到服务器。对比商品显示模块34接收服务器返回的待比对商品的商品数据并在商品对比页面上显示。

如图4所示，对比商品确认模块32包括：事件检测单元321、对比区域确认单元322、对比商品选定单元323、拖动图片生成单元324、拖动图片显示单元325、选中商品确定单元326和拖动图片隐藏单元327。事件检测单元321对事件进行检测。对比区域确认单元322根据事件确定在商品展示页面上选择的对比商品区域。对比商品选定单元323确定此对比商品区域内的多个商品元素所对应的商品为待比对商品。

当监听到第一选择开始事件时，事件检测单元321记录与第一选择开始事件对应的第一坐标。当监听到第一选择结束事件时，事件检测单元321记录与第一选择结束事件对应的第二坐标。对比商品选定单元322根据第一坐标和第二坐标确定对比商品区域。

选中商品确定单元326确定在商品展示页面上选中的第一商品元素，当商品展示页面上的焦点区域位于第二商品元素上、且满足选定条件时，则将第一商品元素和所述第二商品元素确定为待比对商品。

拖动图片生成单元324当判断开始拖拽第一商品元素时添加商品参照层，并在商品参照层上添加与第一商品元素相对应的参照商品元素。拖动图片显示单元325使参照商品元素跟随拖拽的轨迹进行显示。

选中商品确定单元326当判断参照商品元素在商品展示页面上的第二商品元素上方悬停的时长超过预设的时长阈值、或者当参照商品元素位于第二商品元素上方时监听到第二选择结束事件，则确定第二商品元素为待比对商品。拖动图片隐藏单元327当监听到第二选择结束事件时，隐藏商品参照层。

拖动图片生成单元324获取第一商品元素的显示内容和级联样式表信息，依据显示内容和级联样式表信息在商品参照层中创建与第一商品元素相对应的参照商品元素；其中，商品参照层位于顶层，商品参照层覆盖商品展示页面。选中商品确定单元326基于移动事件确定参照商品元素移动到第二商品元素上方，并且开始计时，当判断计时的时长超过预设的时长阈值时，则确定第二商品元素所对应的商品为待比对商品。

如图5所示，拖动图片显示单元325包括：初始坐标记录子单元3251、偏移量计算子单元3252和显示坐标确定子单元3253。初始坐标记录子单元3251当监听到选中第一商品元素的第二选择开始事件时，记录与第二选择开始事件对应的第三坐标。偏移量计算子单元3252监听与参照商品元素的移动对应的移动事件，基于移动事件实时获取参照商品元素的偏移量。显示坐标确定子单元3253基于第三坐标和偏移量实时确定第四坐标，以使参照商品元素的显示位置基于第四坐标而变换。

如图6所示，对比数据发送模块33包括：特征信息获取单元331、特征信息发送单元332。特征信息获取单元331获取预先存储的待比对商品的商品信息，并从此商品信息中提取特征信息。特征信息发送单元332在商品展示页面上提供选择是否进行比对的功能，基于输入的选择指令将待比对商品的特征信息发送到服务器。

如图7所示，商品显示处理模块31包括：检索结果接收单元311和显示布局单元312。检索结果接收单元311接收服务器发送的商品检索结果，其中，商品检索结果包括：HTML文件、CSS文件等。显示布局单元312基于HTML文件、级联样式表信息生成商品展示页面，确定在商品展示页面上显示的商品元素的坐标、并将HTML文件中携带的商品信息进行缓存。

图8为根据本发明的商品信息的对比装置的另一个实施例的模块示意图。如图8所示，该装置可包括存储器81和处理器82，存储器81用于存储指令，处理器82耦合到存储器81，处理器82被配置为基于存储器81存储的指令执行实现上述的商品信息的对比方法。

存储器81可以为高速RAM存储器、非易失性存储器(non-volatile memory)等，存储器81也可以是存储器阵列。存储器81还可能被分块，并且块可按一定的规则组合成虚拟卷。处理器82可以为中央处理器CPU，或专用集成电路ASIC(Application SpecificIntegrated Circuit)，或者是被配置成实施本发明的商品展示方法的一个或多个集成电路。

根据一个实施例，本发明提供一种终端设备，包括：如上的商品信息的对比装置。

上述实施例中的商品信息的对比方法、装置以及终端设备，可直接在商品展示页面中进行发起商品信息对比的操作，不需要打开商品详情页，即可实现商品信息的快速对比，多个商品进行对比时仅需框选要对比商品后进行操作即可，无需反复进入详情页来操作，减少了计算量，降低了对系统资源的占用，减少了网络的负荷，也降低了CPU的使用率，提高了用户体验。

可能以许多方式来实现本发明的方法和系统。例如，可通过软件、硬件、固件或者软件、硬件、固件的任何组合来实现本发明的方法和系统。用于方法的步骤的上述顺序仅是为了进行说明，本发明的方法的步骤不限于以上具体描述的顺序，除非以其它方式特别说明。此外，在一些实施例中，还可将本发明实施为记录在记录介质中的程序，这些程序包括用于实现根据本发明的方法的机器可读指令。因而，本发明还覆盖存储用于执行根据本发明的方法的程序的记录介质。

本发明的描述是为了示例和描述起见而给出的，而并不是无遗漏的或者将本发明限于所公开的形式。很多修改和变化对于本领域的普通技术人员而言是显然的。选择和描述实施例是为了更好说明本发明的原理和实际应用，并且使本领域的普通技术人员能够理解本发明从而设计适于特定用途的带有各种修改的各种实施例。

Claims (14)

1.一种商品信息的对比方法，其特征在于，包括：

对商品展示页面中的事件进行检测，根据所述事件确定在所述商品展示页面上选中的待比对商品；

其中，所述商品展示页面显示接收到的商品信息；当判断开始拖拽在所述商品展示页面上选中的第一商品元素时添加商品参照层，获取所述第一商品元素的显示内容和级联样式表信息，依据所述显示内容和级联样式表信息在所述商品参照层中创建参照商品元素，使所述参照商品元素跟随所述拖拽的轨迹进行显示；所述商品参照层位于顶层，并且所述商品参照层覆盖所述商品展示页面；

基于移动事件确定所述参照商品元素移动到第二商品元素上方，并且开始计时；当判断计时的时长超过预设的时长阈值时，则确定所述第二商品元素所对应的商品为所述待比对商品；或当所述参照商品元素移动到所述第二商品元素上方时监听到第二选择结束事件，则确定所述第二商品元素为待比对商品；其中，当监听到第二选择结束事件时，隐藏所述商品参照层；

获取所述待比对商品的特征信息并将所述特征信息发送到服务器；

接收所述服务器返回的所述待比对商品的商品数据并在商品对比页面上显示。

2.如权利要求1所述的方法，其特征在于，根据所述事件确定在所述商品展示页面上选中的待比对商品包括：

根据所述事件确定在所述商品展示页面上选择的对比商品区域；

确定此对比商品区域内的多个商品元素所对应的商品为所述待比对商品。

3.如权利要求2所述的方法，其特征在于，所述根据所述事件确定在所述商品展示页面上选择的对比商品区域包括：

当监听到第一选择开始事件时，记录与所述第一选择开始事件对应的第一坐标；

当监听到第一选择结束事件时，记录与所述第一选择结束事件对应的第二坐标；

根据所述第一坐标和所述第二坐标确定所述对比商品区域。

4.如权利要求1所述的方法，其特征在于，使所述参照商品元素跟随所述拖拽的轨迹进行显示包括：

当监听到选中第一商品元素的第二选择开始事件时，记录与所述第二选择开始事件对应的第三坐标；

监听与所述参照商品元素的移动对应的移动事件，基于所述移动事件实时获取所述参照商品元素的偏移量；

基于所述第三坐标和偏移量实时确定第四坐标，使所述参照商品元素的显示位置基于所述第四坐标而变换。

5.如权利要求1所述的方法，其特征在于，获取所述待比对商品的特征信息并将所述特征信息发送到服务器包括：

获取预先存储的所述待比对商品的商品信息，并从此商品信息中提取所述特征信息；

在所述商品展示页面上提供选择是否进行比对的功能，基于输入的选择指令将所述待比对商品的特征信息发送到所述服务器；

其中，所述特征信息为商品名称和/或商品的标识号。

6.如权利要求1所述的方法，其特征在于，所述接收商品信息并将所述商品信息在商品展示页面上显示包括：

接收所述服务器发送的商品检索结果，其中，所述商品检索结果包括：HTML文件、CSS文件；

基于所述HTML文件、所述级联样式表信息生成所述商品展示页面，确定在所述商品展示页面上显示的商品元素的坐标、并将所述HTML文件中携带的所述商品信息进行缓存。

7.一种商品信息的对比装置，其特征在于，包括：

对比商品确认模块，用于对商品展示页面中的事件进行检测，根据所述事件确定在所述商品展示页面上选中的待比对商品；其中，所述商品展示页面显示接收到的商品信息；

所述对比商品确认模块，包括：

选中商品确定单元，用于确定在所述商品展示页面上选中的第一商品元素；

拖动图片生成单元，用于当判断开始拖拽所述第一商品元素时添加商品参照层，获取所述第一商品元素的显示内容和级联样式表信息，依据所述显示内容和级联样式表信息在所述商品参照层中创建与第一商品元素相对应的参照商品元素；

拖动图片显示单元，用于使所述参照商品元素跟随所述拖拽的轨迹进行显示；所述商品参照层位于顶层，并且所述商品参照层覆盖所述商品展示页面；

所述选中商品确定单元，还用于基于移动事件确定所述参照商品元素移动到第二商品元素上方，并且开始计时；当判断计时的时长超过预设的时长阈值时，则确定所述第二商品元素所对应的商品为所述待比对商品；或当所述参照商品元素移动到所述第二商品元素上方时监听到第二选择结束事件，则确定所述第二商品元素为待比对商品；

所述对比商品确认模块，还包括：拖动图片隐藏单元，用于当监听到第二选择结束事件时，隐藏所述商品参照层；

对比数据发送模块，用于获取所述待比对商品的特征信息并将所述特征信息发送到服务器；

对比商品显示模块，用于接收所述服务器返回的所述待比对商品的商品数据并在商品对比页面上显示。

8.如权利要求7所述的装置，其特征在于：

所述对比商品确认模块，包括：

事件检测单元，用于对所述事件进行检测；

对比区域确认单元，根据所述事件确定在所述商品展示页面上选择的对比商品区域；

对比商品选定单元，用于确定此对比商品区域内的多个商品元素所对应的商品为所述待比对商品。

9.如权利要求8所述的装置，其特征在于：

所述事件检测单元，还用于当监听到第一选择开始事件时，记录与所述第一选择开始事件对应的第一坐标；当监听到第一选择结束事件时，记录与所述第一选择结束事件对应的第二坐标；

所述对比商品选定单元，还用于根据所述第一坐标和所述第二坐标确定所述对比商品区域。

10.如权利要求7所述的装置，其特征在于：

所述拖动图片显示单元，包括：

初始坐标记录子单元，用于当监听到选中第一商品元素的第二选择开始事件时，记录与所述第二选择开始事件对应的第三坐标；

偏移量计算子单元，用于监听与所述参照商品元素的移动对应的移动事件，基于所述移动事件实时获取所述参照商品元素的偏移量；

显示坐标确定子单元，用于基于所述第三坐标和偏移量实时确定第四坐标，以使所述参照商品元素的显示位置基于所述第四坐标而变换。

11.如权利要求7所述的装置，其特征在于：

所述对比数据发送模块，包括：

特征信息获取单元，用于获取预先存储的所述待比对商品的商品信息，并从此商品信息中提取所述特征信息；

特征信息发送单元，用于在所述商品展示页面上提供选择是否进行比对的功能，基于输入的选择指令将所述待比对商品的特征信息发送到所述服务器；

其中，所述特征信息为商品名称和/或商品的标识号。

12.如权利要求7所述的装置，其特征在于，还包括商品显示处理模块，其中，所述商品显示处理模块包括：

检索结果接收单元，用于接收所述服务器发送的商品检索结果，其中，所述商品检索结果包括：HTML文件、CSS文件；

显示布局单元，用于基于所述HTML文件、所述级联样式表信息生成所述商品展示页面，确定在所述商品展示页面上显示的商品元素的坐标、并将所述HTML文件中携带的所述商品信息进行缓存。

13.一种终端设备，其特征在于，包括：

如权利要求7至12中任一项所述的商品信息的对比装置。

14.一种商品信息的对比装置，其特征在于，包括：

存储器；以及

耦接至所述存储器的处理器，所述处理器被配置为基于存储在所述存储器中的指令，执行如权利要求1至6中任一项所述的商品信息的对比方法。

Images