CN116360975A - 一种对热区内根节点dom元素进行缓存的方法、装置及应用 - Google Patents

Abstract

本申请提出了一种对热区内根节点dom元素进行缓存的方法、装置及应用，包括以下步骤：在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，并设置监听回调函数来获取当前触发事件对应的根节点dom元素存于变量currentElement中；当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作；当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。本方案可以高效的对根节点dom元素的网络请求进行缓存，提高页面性能的同时提高开发效率。

Description

一种对热区内根节点dom元素进行缓存的方法、装置及应用

技术领域

本申请涉及web开发领域，特别是涉及数一种对热区内根节点dom元素进行缓存的方法、装置及应用。

背景技术

在现有技术中，对根节点dom元素中的网络请求进行缓存的方法是通过在需要做请求缓存的根节点dom元素的事件监听回调函数中做定制化开发，从而对请求结果进行缓存，或者是对所有的接口数据做缓存。如果涉及到某个区域都需要这种dom事件中的请求缓存操作，则需要对区域内的每个接口都做定制化开发。

对接口数据进行缓存大部分通过接口的url以及一些特定值来判断是否需要缓存，判断比较繁琐且不能覆盖所有规则；通过定制化开发来对单个根节点dom元素的事件中发出的网络请求进行缓存的方式也由于存在定制化的内容，所以并不利于后续维护，也不能做到统一管理；当需要对页面区域级的dom事件中发出的网络请求做缓存时，要对区域内的每一个目标dom的事件回调做定制化开发，开发周期长且不利于统一维护，这是由于dom的事件都是一个一个定制化开发而来的；由于一个网络页面中可能存在多个根节点dom元素，多个根节点dom元素之间没有清晰的边界，所以对于开发者来说，在对其中的某个根节点dom元素进行缓存时容易影响到其他的根节点dom元素。

所以，亟需一种可以在网页区域级对根节点dom元素事件中的网络请求进行高准确率缓存且不会影响其他区域的缓存方法。

发明内容

本申请实施例提供了一种对热区内根节点dom元素进行缓存的方法、装置及应用，可以在不影响其他区域的前提下对网页区域级根节点dom元素事件中的网络请求进行缓存，且准确率高，在提高了页面性能的同时极大提高了开发效率。

第一方面，本申请实施例提供了一种对热区内根节点dom元素进行缓存的方法，所述方法包括：

在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

第二方面，本申请实施例提供了一种对热区内根节点dom元素进行缓存的装置，包括：

获取模块：在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

拦截模块：当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

缓存模块：当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

第三方面，本申请实施例提供了一种电子装置，包括存储器和处理器，所述存储器中存储有计算机程序，所述处理器被设置为运行所述计算机程序以执行一种对热区内根节点dom元素进行缓存的方法。

第四方面，一种可读存储介质，所述可读存储介质中存储有计算机程序，所述计算机程序包括用于控制过程以执行过程的程序代码，所述过程包括一种对热区内根节点dom元素进行缓存的方法。

本发明的主要贡献和创新点如下：

本方案通过在网络页面中给根节点dom元素一个唯一的id，并通过设定区域边界的方式界定热区，只有在热区内发出的网络请求才会被缓存，具有利于维护，提高效率的效果；本方案通过定义多个全局变量并利用js单线程进行逻辑运算，保证网络请求与根节点dom元素事件的对应关系，无需判断两个网络请求是否相同，减少了内存占用；本方案通过判断函数fn进行网络请求的拦截以及缓存初始化操作，进一步保证了网络请求与根节点dom元素事件的对应关系，减少了内存占用；本方案在网络请求发出之前判断之前是否进行过缓存，不依赖网络请求本身，更利于维护，避免请求唯一性的界定问题；本方案应用于客户端进行缓存，降低了既降低了客户端的负载，又减少了对服务端的请求。

本申请的一个或多个实施例的细节在以下附图和描述中提出，以使本申请的其他特征、目的和优点更加简明易懂。

附图说明

此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：

图1是根据本申请实施例的一种对热区内根节点dom元素进行缓存的方法的流程图；

图2是根据本申请实施例的一种对热区内根节点dom元素进行缓存的装置的结构框图；

图3是根据本申请实施例的电子装置的硬件结构示意图。

具体实施方式

这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本说明书一个或多个实施例相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本说明书一个或多个实施例的一些方面相一致的装置和方法的例子。

需要说明的是：在其他实施例中并不一定按照本说明书示出和描述的顺序来执行相应方法的步骤。在一些其他实施例中，其方法所包括的步骤可以比本说明书所描述的更多或更少。此外，本说明书中所描述的单个步骤，在其他实施例中可能被分解为多个步骤进行描述；而本说明书中所描述的多个步骤，在其他实施例中也可能被合并为单个步骤进行描述。

实施例一

本申请实施例提供了一种对根节点dom元素事件中的网络请求进行缓存的方法，具体地，参考图1，所述方法包括：

在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

在一些实施例中，在“在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中”步骤中，获取满足设定条件的根节点dom元素并为上述每一所述根节点dom元素设定唯一标识，根据带有唯一标识的根节点dom元素界定网络页面的区域边界得到热区，所述变量hotArea捕获所述热区中所有所述根节点dom元素。

具体的，所述设定条件为整个网络页面中使用率相对高的dom元素，所述设定条件可以根据实际情况进行人为设定。

具体的，hotArea为全局变量，由管理人员进行维护，只有在热区内的根节点dom元素才会保存在变量hotArea中，这样设置利于管理人员的维护。

在一些实施例中，在“监听到变量hotArea中的根节点dom元素对应的事件被触发”步骤中，将所述监听回调函数中的捕获参数设置为true来对所述对应的根节点dom元素进行捕获。

具体的，当热区内的根节点dom元素事件被触发后，若所述监听回调函数中的捕获参数设置为true，则根据所述监听回调函数中的第一个参数event.target来获取被触发事件对应的根节点dom元素并存于currentElement中。

示例性的，在所述热区中存在一个按钮，该按钮为所述根节点dom元素，当点击该按钮时会触发一个设定好的事件，在触发这个事件之前，所述监听回调函数会通过event.target来获取这个按钮根节点dom元素存在currentElement中。由于js(JavaScript)是单线程的，所以在后续请求发出进行拦截的时候，便可以知道被拦截的请求时被哪个根节点dom元素触发的。

在一些实施例中，在“当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时”步骤中，或者判断hotArea.contains(currentElement)函数的返回值是否为真，若hotArea.contains(currentElement)函数的返回值为真则表示所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素。

在一些具体实施例中，也可以直接判断所述变量currentElement中的根节点dom元素是否等于所述变量hotArea中的根节点dom元素，若等于则表示所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素。

具体的，变量currentElement中的根节点dom元素为当前触发事件的根节点dom元素，hotArea中的根节点dom元素为热区中的根节点dom元素，若变量currentElement中的根节点dom元素与hotArea中的根节点dom元素相等，则表示当前触发事件的根节点dom元素与热区根节点中的根节点dom元素相同。

具体的，hotArea.contains(currentElement)为一种判断函数，判断当前触发事件的根节点dom元素是否与热区根节点中的根节点dom元素相同，若返回值为真，则代表当前触发事件的根节点dom元素与热区根节点中的根节点dom元素相同，若返回值为假则忽略此次触发事件。

在一些实施例中，在“在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作”步骤中，通过所述变量currentElement获取所述根节点dom元素对应事件并存于变量tempEvent中，在所述事件处理函数中定义一个判断函数fn，使用所述判断函数fn初始化所述根节点dom元素的缓存结果。

具体的，将所述根节点dom元素对应事件存于变量tempEvent中的好处在于，由于热区中可能存在多种不同类型的事件，将这些事件统一存放在变量tempEvent中便可以从页面的任何位置都能获取到事件信息，这样操作会使得获取事件信息更加方便，另一方面在进行缓存时可以根据不同的事件类型进行更加准确的获取缓存。

具体的，所述初始化操作时在首次执行判断函数fn中默认所述根节点dom元素的缓存值为空值。

示例性的，热区内存在一个根节点dom元素的点击事件，通过currentElement.onclick获取该点击事件，并存于变量tempEvent中，所述变量tempEvent，所述tempEvent为js中的一个全局变量，可以将一个事件进行存储。

具体的，所述判断函数fn用来判断所述根节点dom元素是否已被缓存并初始化所述根节点dom元素的缓存结果，所述判断函数fn包括cacheMap.set(currentElement,{event:‘click’,value:null,alreadyRequest:false}})，其中，currentElement表示触发事件的根节点dom元素；event表示触发的事件；click表示点击事件；value:null表示缓存结果，默认为空值；alreadyRequest:false表示当前事件没有发出过网络请求；当alreadyRequest的值为true时，表示当前根节点dom元素发出过网络请求。

具体的，通过fn函数进行缓存初始化可以将每一根节点dom元素的网络请求与对应的网络请求结果进行对应，当这个根节点dom元素再次进行相同的网络请求时，可以根据对应关系直接取出网络请求结果，现有技术则需要通过网络请求的url和请求头进行判断发出的两次请求是否为同一个请求，判断后才能取出对应的网络请求结果，本方案省下了一步判断操作，减少内存占用。

具体的，所述根节点dom元素的事件处理函数中包含多个业务逻辑，在对所述事件处理函数进行拦截时只拦截其中的网络请求，本方案通过拦截所述根节点dom元素的网络请求，并改写所述事件处理函数，便可以在网络请求执行之前对应根节点dom元素进行缓存初始化，并将所述网络请求与所述根节点dom元素进行对应。

进一步的，使用cacheMap.get(currentElement).alreadyRequest来判断所述判断函数fn中的alreadyRequest是否为真，若alreadyRequest为真则表示对应的根节点dom元素已被缓存，无需发送所述根节点dom元素对应的网络请求，获取所述根节点dom元素的缓存值并返回；若alreadyRequest为假则表示对应的根节点dom元素的缓存值为空值。

具体的，若所述alreadyRequest的值为真，则通过cacheMap.get(currentElement).value获取该根节点dom元素对应的缓存值并返回，无需发出所述网络请求，节省了时间成本。cacheMap为一个Map数据结构的变量，其键为根节点dom元素，值为所述根节点dom元素的缓存值或请求结果；get(currentElement)为获取currentElement中根节点dom元素的方法，value为所述根节点dom元素的缓存值或请求结果。

具体的，若所述alreadyRequest的值为假，则发出所述根节点dom元素对应的网络请求，将所述网络请求的请求结果存为变量result，并更新所述网络请求对应的根节点dom元素的缓存值，更新缓存值的方法为cacheMap.set(currentElement,{event:‘click’,value:result,alreadyRequest:true}})，其中cacheMap表示一个Map数据结构的变量；set表示一种保存方法；currentElement表示根节点dom元素；event:‘click’表示根节点dom元素对应的点击事件；value:result表示将值更新为result；alreadyRequest:true表示将alreadyRequest设置为true(真)。

也就是说，当更新缓存结果后将判断函数fn中的alreadyRequest设置为真，当再次发出同样的网络请求时，可以直接获取缓存结果并返回，无需再次发出网络请求，减少内存占用。

在一些实施例中，在使用所述请求结果对对应的根节点dom元素缓存值进行更新的同时将currentElement设置为null，将inCacheAre设置为false，将currentElement设置为null表示并无触发事件的根节点dom元素，将inCacheAre设置为false表示热区中并无触发事件的根节点dom元素。

具体的，由于js为单线程，所以在使用所述请求结果对对应的根节点dom元素缓存值进行更新的同时需要将currentElement为null，将inCacheAre为false以便发起下一轮缓存。

具体的，若所述根节点dom元素已被缓存，在获取所述dom元素对应的缓存值时，同样要将currentElement设置为null，将inCacheAre设置为false，以便发起下一轮缓存。

具体的，现有的缓存方法一般存在与asp的底层api中，其依赖服务端的渲染能力，解决的是在服务端进行数据的缓存，而本发明主要应用于客户端，既降低了客户端的负载，又减少了对服务端的请求。

具体的，因为浏览器的请求并发是有个数限制的，比如chrome浏览器最多支持6个请求同时发出，使用客户端进行缓存，就避免浏览器的请求发出，所以就降低了浏览器(客户端)的负载。

实施例二

基于相同的构思，参考图2，本申请还提出了一种对根节点dom元素事件中的网络请求进行缓存的装置，包括：

获取模块：在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

拦截模块：当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

缓存模块：当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

实施例三

本实施例还提供了一种电子装置，参考图3，包括存储器404和处理器402，该存储器404中存储有计算机程序，该处理器402被设置为运行计算机程序以执行上述任一项方法实施例中的步骤。

具体地，上述处理器402可以包括中央处理器(CPU)，或者特定集成电路(ApplicationSpecificIntegratedCircuit，简称为ASIC)，或者可以被配置成实施本申请实施例的一个或多个集成电路。

其中，存储器404可以包括用于数据或指令的大容量存储器404。举例来说而非限制，存储器404可包括硬盘驱动器(HardDiskDrive，简称为HDD)、软盘驱动器、固态驱动器(SolidStateDrive，简称为SSD)、闪存、光盘、磁光盘、磁带或通用串行总线(UniversalSerialBus，简称为USB)驱动器或者两个或更多个以上这些的组合。在合适的情况下，存储器404可包括可移除或不可移除(或固定)的介质。在合适的情况下，存储器404可在数据处理装置的内部或外部。在特定实施例中，存储器404是非易失性(Non-Volatile)存储器。在特定实施例中，存储器404包括只读存储器(Read-OnlyMemory，简称为ROM)和随机存取存储器(RandomAccessMemory，简称为RAM)。在合适的情况下，该ROM可以是掩模编程的ROM、可编程ROM(ProgrammableRead-OnlyMemory，简称为PROM)、可擦除PROM(ErasableProgrammableRead-OnlyMemory，简称为EPROM)、电可擦除PROM(ElectricallyErasableProgrammableRead-OnlyMemory，简称为EEPROM)、电可改写ROM(ElectricallyAlterableRead-OnlyMemory，简称为EAROM)或闪存(FLASH)或者两个或更多个以上这些的组合。在合适的情况下，该RAM可以是静态随机存取存储器(StaticRandom-AccessMemory，简称为SRAM)或动态随机存取存储器(DynamicRandomAccessMemory，简称为DRAM)，其中，DRAM可以是快速页模式动态随机存取存储器404(FastPageModeDynamicRandomAccessMemory，简称为FPMDRAM)、扩展数据输出动态随机存取存储器(ExtendedDateOutDynamicRandomAccessMemory，简称为EDODRAM)、同步动态随机存取内存(SynchronousDynamicRandom-AccessMemory，简称SDRAM)等。

存储器404可以用来存储或者缓存需要处理和/或通信使用的各种数据文件，以及处理器402所执行的可能的计算机程序指令。

处理器402通过读取并执行存储器404中存储的计算机程序指令，以实现上述实施例中的任意一种对根节点dom元素事件中的网络请求进行缓存的方法。

可选地，上述电子装置还可以包括传输设备406以及输入输出设备408，其中，该传输设备406和上述处理器402连接，该输入输出设备408和上述处理器402连接。

传输设备406可以用来经由一个网络接收或者发送数据。上述的网络具体实例可包括电子装置的通信供应商提供的有线或无线网络。在一个实例中，传输设备包括一个网络适配器(Network Interface Controller，简称为NIC)，其可通过基站与其他网络设备相连从而可与互联网进行通讯。在一个实例中，传输设备406可以为射频(Radio Frequency，简称为RF)模块，其用于通过无线方式与互联网进行通讯。

输入输出设备408用于输入或输出信息。在本实施例中，输入的信息可以是根节点dom元素等，输出的信息可以请求结果、缓存值等。

可选地，在本实施例中，上述处理器402可以被设置为通过计算机程序执行以下步骤：

S101、在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

S102、当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

S103、当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

需要说明的是，本实施例中的具体示例可以参考上述实施例及可选实施方式中所描述的示例，本实施例在此不再赘述。

通常，各种实施例可以以硬件或专用电路、软件、逻辑或其任何组合来实现。本发明的一些方面可以以硬件来实现，而其他方面可以以可以由控制器、微处理器或其他计算设备执行的固件或软件来实现，但是本发明不限于此。尽管本发明的各个方面可以被示出和描述为框图、流程图或使用一些其他图形表示，但是应当理解，作为非限制性示例，本文中描述的这些框、装置、系统、技术或方法可以以硬件、软件、固件、专用电路或逻辑、通用硬件或控制器或其他计算设备或其某种组合来实现。

本发明的实施例可以由计算机软件来实现，该计算机软件由移动设备的数据处理器诸如在处理器实体中可执行，或者由硬件来实现，或者由软件和硬件的组合来实现。包括软件例程、小程序和/或宏的计算机软件或程序(也称为程序产品)可以存储在任何装置可读数据存储介质中，并且它们包括用于执行特定任务的程序指令。计算机程序产品可以包括当程序运行时被配置为执行实施例的一个或多个计算机可执行组件。一个或多个计算机可执行组件可以是至少一个软件代码或其一部分。另外，在这一点上，应当注意，如图3中的逻辑流程的任何框可以表示程序步骤、或者互连的逻辑电路、框和功能、或者程序步骤和逻辑电路、框和功能的组合。软件可以存储在诸如存储器芯片或在处理器内实现的存储块等物理介质、诸如硬盘或软盘等磁性介质、以及诸如例如DVD及其数据变体、CD等光学介质上。物理介质是非瞬态介质。

本领域的技术人员应该明白，以上实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。

以上实施例仅表达了本申请的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本申请范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本申请构思的前提下，还可以做出若干变形和改进，这些都属于本申请的保护范围。因此，本申请的保护范围应以所附权利要求为准。

Claims (10)

1.一种对热区内根节点dom元素进行缓存的方法，其特征在于，包括以下步骤：

在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

2.根据权利要求1所述的一种对热区内根节点dom元素进行缓存的方法，其特征在于，在“在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中”步骤中，获取满足设定条件的根节点dom元素并为上述每一所述根节点dom元素设定唯一标识，根据带有唯一标识的根节点dom元素界定网络页面的区域边界得到热区，所述变量hotArea捕获所述热区中所有所述根节点dom。

3.根据权利要求1所述的一种对热区内根节点dom元素进行缓存的方法，其特征在于，在“监听到变量hotArea中的根节点dom元素对应的事件被触发”步骤中，将所述监听回调函数中的捕获参数设置为true来对对应的根节点dom元素进行捕获。

4.根据权利要求1所述的一种对热区内根节点dom元素进行缓存的方法，其特征在于，在“当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时”步骤中，判断hotArea.contains(currentElement)函数的返回值是否为真，若hotArea.contains(currentElement)函数的返回值为真则表示所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素。

5.根据权利要求1所述的一种对热区内根节点dom元素进行缓存的方法，其特征在于，在“在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作”步骤中，通过所述变量currentElement获取所述根节点dom元素对应事件并存于变量tempEvent中，在所述事件处理函数中定义一个判断函数fn，使用所述判断函数fn初始化所述根节点dom元素的缓存结果。

6.根据权利要求5所述的一种对热区内根节点dom元素进行缓存的方法，其特征在于，使用cacheMap.get(currentElement).alreadyRequest来判断所述判断函数fn中的alreadyRequest是否为真，若alreadyRequest为真则表示对应的根节点dom元素已被缓存，无需向服务器发送所述根节点dom元素对应的网络请求，获取所述根节点dom元素的缓存值并返回；若alreadyRequest为假则表示对应的根节点dom元素的缓存值为空值。

7.根据权利要求1所述的一种对热区内根节点dom元素进行缓存的方法，其特征在于，在使用所述请求结果对对应的根节点dom元素缓存值进行更新的同时将currentElement设置为null，将inCacheAre设置为false。

8.一种对热区内根节点dom元素进行缓存的装置，其特征在于，包括：

获取模块：在网络页面内划定热区并获取所述热区的根节点dom元素存于变量hotArea中，在所述变量hotArea中设置事件监听，并添加监听回调函数，当监听到变量hotArea中的根节点dom元素对应的事件被触发时，所述监听回调函数获取当前触发事件对应的根节点dom元素存于变量currentElement中；

拦截模块：当所述变量currentElement中的根节点dom元素同于所述变量hotArea中的根节点dom元素时，拦截所述根节点dom元素的事件处理函数，所述事件处理函数中包括所述根节点dom元素的网络请求，在所述事件处理函数中对对应的根节点dom元素做缓存初始化操作，所述缓存初始化是将所述根节点dom元素对应的缓存值设置为空值；

缓存模块：当所述根节点dom元素对应的缓存值为空值时，发出所述事件处理函数中的网络请求得到请求结果，并使用所述请求结果对对应的根节点dom元素缓存值进行更新。

9.一种电子装置，包括存储器和处理器，其特征在于，所述存储器中存储有计算机程序，所述处理器被设置为运行所述计算机程序以执行权利要求1到7任一所述的一种对热区内根节点dom元素进行缓存的方法。

10.一种可读存储介质，其特征在于，所述可读存储介质中存储有计算机程序，所述计算机程序包括用于控制过程以执行过程的程序代码，所述过程包括权利要求1到7任一所述的一种对热区内根节点dom元素进行缓存的方法。

Images