处理网页鼠标点击事件的方法与流程

本发明涉及一种WEB客户端互动方法，尤其是一种处理网页鼠标点击事件的方法。

背景技术：
随着互联网络技术的不断发展，网络的普及程度越来越高，而网站作为互联网的主要内容供应者也得到了长足的发展。网站不再满足于仅仅提供统一制式的内容而是希望能更多的与用户互动进而可以实现按用户的需求提供内容服务。通常，现有的网站一般通过捕获并处理用户对页面的操作事件实现与用户的互动，较为流行的做法是采用HTML超文本中对DOM节点的事件绑定，HTMLDOM定义了访问和操作HTML文档的标准方法，HTMLDOM把HTML文档呈现为带有元素、属性和文本的树结构，在这种DOM树结构中，当需要频繁处理页面中大量DOM节点的自定义事件处理时，常用的做法是通过脚本筛选出需要绑定事件的DOM节点，并通过循环的方式为每个节点绑定事件处理功能模块，当被绑定的DOM节点元素被浏览器重新渲染加载时，需要再次为其做绑定操作；另一种方法是，通过定义每个DOM节点的属性，为节点指定事件处理功能模块，此种做法虽然能够改善循环引起的性能损耗和重新渲染引起的重新绑定，但增加了页面元素与处理逻辑的耦合性，为程序的扩展和需求变更带来麻烦。

技术实现要素：
针对现有的DOM事件处理方式存在的上述问题，本发明提供一种利用DOM事件冒泡机制处理网页鼠标点击事件的方法。本发明解决技术问题所采用的技术方案为：处理网页鼠标点击事件的方法，其中，包括服务端和客户端，所述客户端通过通讯媒介与所述服务端连接，具体包括如下步骤；步骤a、所述服务端向所述客户端传送数据信号；步骤b、所述客户端将步骤a中收到的信号组合成带有树形结构的DOM节点的超文本文件，所述超文本文件包括与所述树形结构的根节点相连接的根节点事件监听模块和与所述根节点事件监听模块相连接的根节点事件处理模块，所述根节点事件处理模块用于处理部分用户操作对应的事件；步骤c、所述客户端以基于超文本协议并以冒泡机制处理DOM事件流的浏览器解释并显示所述超文本文件并接受用户操作；步骤d、所述根节点事件监听模块判断所述用户操作对应的事件目标节点是否在所述根节点事件处理模块的处理范围内，并将在所述根节点事件处理模块处理范围内的事件发送至所述根节点事件处理模块进行处理并退出；步骤e、如所述用户操作对应的事件目标节点不在所述根节点事件处理模块的处理范围内则找到所述目标节点，并检查所述目标节点是否存在对应的节点事件处理模块，如存在则将所述用户操作对应的事件发送至所述目标节点对应的节点事件处理模块进行处理并退出。上述处理网页鼠标点击事件的方法，其中，于所述步骤e执行完毕后如所述目标节点不存在对应的节点事件处理模块，则于所述树形结构上查找所述目标节点的父节点，并检查所述目标节的父节点是否存在对应的节点事件处理模块，如存在且所述用户操作对应的事件在所述目标节点的父节点对应的节点事件处理模块的处理范围内则将所述用户操作对应的事件发送至所述目标节点的父节点对应的节点事件处理模块进行处理并退出。上述处理网页鼠标点击事件的方法，其中，如所述目标节点的父节点不存在对应的节点事件处理模块或者所述用户操作对应的事件不在所述目标节点的父节点所对应的节点事件处理模块的处理范围，则于所述树形结构上查找所述目标节点的父节点的父节点，并检查所述目标节的父节点的父节点是否存在对应的节点事件处理模块，如存在且所述用户操作对应的事件在所述目标节点的父节点的父节点对应的节点事件处理模块的处理范围内则将所述用户操作对应的事件发送至所述目标节点的父结点的父结点对应的节点事件处理模块进行处理并退出。上述处理网页鼠标点击事件的方法，其中，所述超文本文件中的部分DOM节点包括与该DOM相连接的节点事件处理模块，所述包含节点事件处理模块的DOM节点对应的节点事件处理模块用于处理以对应的DOM节点为目标节点和/或以对应的DOM节点的子节点为目标节点和/或以对应的DOM节点的子节点的子节点为目标节点的事件。上述处理网页鼠标点击事件的方法，其中，所述超文本文件中的部分DOM节点包括与该DOM节点以及该节点的父节点相连接的节点事件监听模块和与所述结点事件监听模块相连接并与该DOM节点对应的节点事件处理模块；所述节点事件监听模块用于监听以对应的DOM节点为目标节点的事件并判断所述事件是否在与该目标节点对应的节点事件处理模块的处理范围内，将处于目标节点对应的节点事件处理模块处理范围内的事件传送至所述目标节点对应的节点事件处理模块处理并终止事件继续冒泡。上述处理网页鼠标点击事件的方法，其中，所述浏览器为IE。上述处理网页鼠标点击事件的方法，其中，所述根节点事件监听模块以及根节点事件处理模块主要由嵌入所述超文本文件的脚本形成。上述处理网页鼠标点击事件的方法，其中，所述节点事件处理模块主要由嵌入所述超文本文件的脚本形成。上述处理网页鼠标点击事件的方法，其中，所述节点事件监听模块以及节点事件处理模块主要由嵌入所述超文本文件的脚本形成。本发明的有益效果是：在根节点统一拦截DOM事件，一次统一拦截事件发起目标元素，提高了时间处理的效率，时间处理模块统一部署于根节点，重新渲染根节点内元素无需重新绑定事件，降低了页面元素与事件处理逻辑的耦合性，为扩展和需求变更带来便利。附图说明图1是本发明一种处理网页鼠标点击事件的方法的流程框图；图2是本发明一种处理网页鼠标点击事件的方法的模块结构图。具体实施方式下面结合附图和具体实施例对本发明作进一步说明，但不作为本发明的限定。如图2所示，本发明处理网页鼠标点击事件的方法，其中，包括服务端和客户端，客户端通过通讯媒介与服务端连接，如图1所示具体包括如下步骤；步骤a、服务端向客户端传送数据信号；步骤b、客户端将步骤a中收到的信号组合成带有树形结构的DOM节点的超文本文件，超文本文件包括与树形结构的根节点相连接的根节点事件监听模块和与根节点事件监听模块相连接的根节点事件处理模块，根节点事件处理模块用于处理部分用户操作对应的事件；步骤c、客户端以基于超文本协议并以冒泡机制处理DOM事件流的浏览器解释并显示超文本文件并接受用户操作；步骤d、根节点事件监听模块判断用户操作对应的事件目标节点是否在根节点事件处理模块的处理范围内，并将在根节点事件处理模块处理范围内的事件发送至根节点事件处理模块进行处理并退出；步骤e、如用户操作对应的事件目标节点不在根节点事件处理模块的处理范围内则找到目标节点，并检查目标节点是否存在对应的节点事件处理模块，如存在则将用户操作对应的事件发送至目标节点对应的节点事件处理模块进行处理并退出。进一步的，其中，于步骤e执行完毕后如目标节点不存在对应的节点事件处理模块，则于树形结构上查找目标节点的父节点，并检查目标节的父节点是否存在对应的节点事件处理模块，如存在且用户操作对应的事件在目标节点的父节点对应的节点事件处理模块的处理范围内则将用户操作对应的事件发送至目标节点的父节点对应的节点事件处理模块进行处理并退出。如目标节点的父节点不存在对应的节点事件处理模块或者用户操作对应的事件不在目标节点的父节点所对应的节点事件处理模块的处理范围，则于树形结构上查找目标节点的父节点的父节点，并检查目标节的父节点的父节点是否存在对应的节点事件处理模块，如存在且用户操作对应的事件在目标节点的父节点的父节点对应的节点事件处理模块的处理范围内则将用户操作对应的事件发送至目标节点的父结点的父结点对应的节点事件处理模块进行处理并退出。进一步的，其中，超文本文件中的部分DOM节点包括与该DOM相连接的节点事件处理模块，包含节点事件处理模块的DOM节点对应的节点事件处理模块用于处理以对应的DOM节点为目标节点和/或以对应的DOM节点的子节点为目标节点和/或以对应的DOM节点的子节点的子节点为目标节点的事件。或者超文本文件中的部分DOM节点包括与该DOM节点以及该节点的父节点相连接的节点事件监听模块和与结点事件监听模块相连接并与该DOM节点对应的节点事件处理模块；节点事件监听模块用于监听以对应的DOM节点为目标节点的事件并判断事件是否在与该目标节点对应的节点事件处理模块的处理范围内，将处于目标节点对应的节点事件处理模块处理范围内的事件传送至目标节点对应的节点事件处理模块处理并终止事件继续冒泡。进一步的，其中，浏览器可以是IE或者其他支持DOM事件冒泡机制的浏览器如Firefox、Opera和Safari等。进一步的，其中，根节点事件监听模块、根节点事件处理模块、节点事件监听模块以及节点事件处理模块主要由嵌入超文本文件的脚本形成，脚本可以是JavaScript脚本或者VBScript脚本。或者也可以由脚本和服务端功能模块共同形成根节点事件监听模块、根节点事件处理模块、节点事件监听模块以及节点事件处理模块，这取决于实际的功能需要。以上所述仅为本发明较佳的实施例，并非因此限制本发明的申请专利范围，所以凡运用本发明说明书及图示内容所作出的等效结构变化以及本领域技术人员惯用的手段替换，均包含在本发明的保护范围内。