[发明专利]网页元素拖拽方法和装置

说明书

技术领域

本发明涉及通信技术领域，特别涉及一种网页元素拖拽方法和装置。

背景技术

网页（Web page）是构成网站的基本元素，是承载各种网站应用的平台。网页存放在某一部与互联网相连的计算机（或服务器）中。

网页经由URL（Uniform / Universal Resource Locator，统一资源定位符，即网址）来识别与存取，当用户在浏览器输入网址后，经过一段复杂而又快速的程序，网页文件会被传送到用户所在的计算机，然后再通过浏览器解释网页的内容，并展示在用户眼前。

网页是万维网（World Wide Web，WWW）中的一“页”，通常是HTML（Hypertext Markup Language，文本标记语言）格式（文件扩展名为.html或.htm）。网页要透过网页浏览器来阅读。

Dom（Document Object Model，文档对象模型）节点是构成一个网页的元素。DOM是一种抽象的概念，其必须包含一些特性，比如根节点、子节点、以及如何获得这些节点的方法，比如在javascript中，网页作为一个具备DOM特性的文档对象，HTML就是其根节点，访问网页的某个节点可以使用document.getElementById（'id属性名称'），如果存在这个节点就返回一个DOM节点， 这个节点有nodeName（节点名称），nodeType（节点类型）等相关的DOM节点属性。

Dom节点的组合形成了网页。而在网页中存放其他元素的元素则被称为“容器”。

在实际的应用中，为了实现用户对于网页的个性化设置，往往需要通过拖拽来对网页中的元素进行操作，从而，满足用户的需求。

在具体的应用场景中，拖拽的目的最终是为了把一个元素移到一个容器中。

拖拽实现的前提是当前存在多于一个的容器，其中，如果存在多个容器，则各容器相互之间互不包含，元素的定位方式为绝对定位（position:absolute）。

在现有的技术方案中，元素拖拽的实现过程如图1所示，在鼠标移动时，计算鼠标本次坐标（A+xoffset，B+yoffset）与上次坐标（A，B）之间的差值，即确定拖拽后坐标与拖拽前坐标的偏移值（xoffset，yoffset），从而，使被拖拽的元素的坐标（x，y）加上对应的同样的差值即可实现拖拽。

在鼠标释放时，获得鼠标的坐标，计算每个可以存放被拖拽元素的容器的绝对位置、高宽和深度(z-index)，判断鼠标释放时的鼠标坐标是否落在某个容器所在矩形区域内，且该坐标所属区域不被遮挡，如果是，则将元素移到该容器中。

在实现本发明实施例的过程中，申请人发现现有技术至少存在以下问题：

现有算法要求在判断元素落在哪个容器时必须知道所有容器的位置，大小和深度，而这并不是很容易得到的，特别是深度。

另外，即使得到鼠标本次坐标落在某个容器的矩形区域内，还必须判断鼠标本次坐标所在的区域是否被其他容器遮挡，而这必须通过计算所有容器的矩形区域，并逐个进行判断来完成，计算过程非常复杂，且由于需要遍历进行复杂的计算，会影响相应处理过程的性能和效率。

发明内容

本发明实施例提供一种网页元素拖拽方法和装置，解决在现有技术中网页元素处理过程过于复杂，影响操作性能和效率的问题。

为达到上述目的，本发明实施例一方面提供了一种网页元素拖拽方法，所述方法具体包括：

当接收到将待拖拽元素拖拽到当前位置并释放的操作指令时，获取当前位置的坐标信息；

确定所述当前位置的坐标信息所对应的坐标点所在的最上层元素；

判断所述最上层元素是否为容器；

如果判断结果为是，将所述待拖拽元素移动到所述容器中，如果判断结果为否，则执行步骤A；

步骤A、获取当前判断结果为否的元素的父级元素，然后执行步骤B；

步骤B、判断所述父级元素是否为容器，如果判断结果为是，将所述待拖拽元素移动到所述容器中，如果判断结果为否，则执行步骤A。

另一方面，本发明实施例还提供了一种网络设备，具体包括：

接收模块，用于当接收到将待拖拽元素拖拽到当前位置并释放的操作指令时，获取当前位置的坐标信息；

确定模块，用于确定所述接收模块所获取的当前位置的坐标信息所对应的坐标点所在的最上层元素；

判断模块，用于判断所述确定模块所确定的元素是否为容器；