Front-end element incidence relation determination method and device and electronic equipment

By acquiring front-end page and script data, multiple interaction layers are identified, and the element structure is decomposed and sorted out layer by layer according to the relationships within and between layers. This solves the problem of inaccurate front-end element relationships and improves development and operation efficiency.

CN121832931APending Publication Date: 2026-04-10AGRICULTURAL BANK OF CHINA
View PDF 0 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-11-26
Publication Date
2026-04-10

AI Technical Summary

Technical Problem

In the software development process, inaccurate determination of the relationships between front-end elements leads to low development and maintenance efficiency.

Method used

By acquiring front-end page data and script data, multiple interaction layers are identified. Based on the relationships within and between layers, the structural relationships of elements are broken down and sorted out layer by layer, clarifying the interaction logic of elements at the same functional granularity and the inclusion and being included logic of elements between different layers.

Benefits of technology

It achieves a comprehensive reflection of the front-end element relationship architecture, improves development and operation efficiency, and avoids inefficiency caused by ambiguity in element relationships.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN121832931A_ABST
    Figure CN121832931A_ABST
Patent Text Reader

Abstract

The invention provides a front-end element incidence relation determination method and device and electronic equipment. The method comprises the following steps: acquiring page data and script data of a front end; determining a plurality of interaction layers corresponding to the front end according to the page data and the script data; determining an intra-layer association relationship and a first inter-layer relationship respectively corresponding to the plurality of interaction layers; and determining a target association relationship corresponding to the front end according to the intra-layer association relationship and the first inter-layer relationship corresponding to the plurality of interaction layers. According to the method and the device, the technical problem of low development, operation and maintenance efficiency of the front end caused by inaccurate determination of the element association relationship when the element association relationship of the front end is determined in the related technology is solved.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of artificial intelligence, in particular to a front-end element association relationship determination method and device and electronic equipment. BACKGROUND

[0002] In the software development process, according to the architecture level and the responsibility division, the development work is divided into front-end development and back-end development two major blocks: the front-end is the entrance for the user to directly interact, and undertakes the function of user visible interface presentation and interaction response; the back-end is responsible for processing more fine-grained bottom logic, and providing data support to the front-end through the interface. In the conventional development and operation and maintenance scene, since the element interaction logic of the front-end is complex and widely distributed, it is necessary to determine the element association relationship of the front-end. However, in the related technology, when determining the element association relationship of the front-end, the element association relationship is not determined accurately, which leads to the technical problem of low development and operation and maintenance efficiency of the front-end.

[0003] At present, no effective solution has been proposed for the above problems. SUMMARY

[0004] The main purpose of the present application is to provide a front-end element association relationship determination method and device and electronic equipment, so as to at least solve the technical problem that in the related technology, when determining the element association relationship of the front-end, the element association relationship is not determined accurately, which leads to the low development and operation and maintenance efficiency of the front-end.

[0005] In order to achieve the above purpose, according to one aspect of the present application, a front-end element association relationship determination method is provided, comprising: acquiring page data and script data of a front-end, wherein the front-end is used for interactive operation of a target object; determining a plurality of interaction layers corresponding to the front-end according to the page data and the script data, wherein for any two adjacent upper layer interaction layer and lower layer interaction layer in the plurality of interaction layers, the interactive function range corresponding to the lower layer interaction layer belongs to the interactive function range corresponding to the upper layer interaction layer, and the interactive elements in the upper layer interaction layer include at least one interactive element in the lower layer interaction layer; determining layer-in association relationship and first inter-layer relationship corresponding to the plurality of interaction layers respectively, wherein the layer-in association relationship is the association relationship between the interactive elements in the corresponding interaction layer, the first inter-layer relationship is the association relationship between the interactive elements in the corresponding interaction layer and the lower layer elements, and the lower layer elements are the interactive elements in the lower layer interaction layer corresponding to the corresponding interaction layer; determining the target association relationship corresponding to the front-end according to the layer-in association relationship and the first inter-layer relationship corresponding to the plurality of interaction layers respectively.

[0006] Optionally, the determining the target association relationship corresponding to the front end according to the intra-layer association relationship and the first inter-layer relationship corresponding to the plurality of interaction layers comprises: determining a second inter-layer relationship corresponding to the plurality of interaction layers, wherein the second inter-layer relationship is an association relationship between an interaction element in a corresponding interaction layer and an upper layer element in an upper layer interaction layer corresponding to the corresponding interaction layer; and determining the target association relationship corresponding to the front end according to the intra-layer association relationship, the first inter-layer relationship and the second inter-layer relationship.

[0007] Optionally, the determining the intra-layer association relationship corresponding to each of the plurality of interaction layers comprises: for any one of the plurality of interaction layers, determining the intra-layer association relationship corresponding to the any one of the plurality of interaction layers in the following manner: determining a starting point element corresponding to the any one of the plurality of interaction layers from a plurality of interaction elements included in the any one of the plurality of interaction layers; determining a first same-layer element corresponding to the starting point element according to an execution order of the plurality of interaction elements, and determining a first association relationship corresponding to the any one of the plurality of interaction layers according to the starting point element and the first same-layer element, wherein the first same-layer element is an interaction element in the plurality of interaction elements that has a functional association relationship with the starting point element; determining a next same-layer element corresponding to the first same-layer element, and determining a next association relationship corresponding to the any one of the plurality of interaction layers according to the first same-layer element and the next same-layer element until a target condition is reached, thereby obtaining the intra-layer association relationship corresponding to the any one of the plurality of interaction layers, wherein the target condition comprises any one of the following: the plurality of interaction elements are processed.

[0008] Optionally, the determining the next same-layer element corresponding to the first same-layer element comprises: removing the starting point element from the plurality of interaction elements to obtain a plurality of updated elements; and determining the next same-layer element corresponding to the first same-layer element from the plurality of updated elements.

[0009] Optionally, the determining the starting point element corresponding to the any one of the plurality of interaction layers from the plurality of interaction elements included in the any one of the plurality of interaction layers comprises: in a case where the any one of the plurality of interaction layers is a first layer in the plurality of interaction layers, determining trigger bit positions corresponding to the plurality of interaction elements in the any one of the plurality of interaction layers; and determining the starting point element from the plurality of interaction elements according to the trigger bit positions corresponding to the plurality of interaction elements, wherein the starting point element is an interaction element in the plurality of interaction elements that has a first trigger bit position.

[0010] Optionally, determining the target association relationship with the front end based on the intra-layer association relationship and the first inter-layer relationship corresponding to the plurality of interaction layers includes: determining a first identifier parameter corresponding to each of the plurality of interaction layers; for any one of the plurality of interaction layers, determining a second identifier parameter corresponding to each of the plurality of interaction elements in that interaction layer; determining a target identifier parameter corresponding to each of the plurality of interaction layers based on the first identifier parameter corresponding to each of the plurality of interaction layers and the second identifier parameter corresponding to each of the plurality of interaction elements; and determining the target association relationship with the front end based on the target identifier parameter corresponding to each of the plurality of interaction layers, the intra-layer association relationship, and the first inter-layer relationship.

[0011] Optionally, before determining the intra-layer association and inter-layer relationship corresponding to the plurality of interaction layers respectively, the method further includes: for any one of the plurality of interaction layers, determining the execution logic parameter corresponding to the any one interaction layer, wherein the execution logic parameter is used to represent the interaction execution logic feature corresponding to the any one interaction layer; and determining the plurality of interaction elements corresponding to the any one interaction layer based on the execution logic parameter.

[0012] According to another aspect of this application, a front-end element association relationship determination device is provided, comprising: an acquisition module, configured to acquire front-end page data and script data, wherein the front-end is used for interactive operations on a target object; a first determination module, configured to determine multiple interaction layers corresponding to the front-end based on the page data and the script data, wherein for any two adjacent upper and lower interaction layers among the multiple interaction layers, the interaction function range corresponding to the lower interaction layer belongs to the interaction function range corresponding to the upper interaction layer, and the interaction element in the upper interaction layer includes at least one interaction element in the lower interaction layer; a second determination module, configured to determine intra-layer association relationships and first inter-layer relationships corresponding to the multiple interaction layers respectively, wherein the intra-layer association relationship is the association relationship between interaction elements within the corresponding interaction layer, and the first inter-layer relationship is the association relationship between an interaction element in the corresponding interaction layer and a lower-layer element, wherein the lower-layer element is an interaction element in the lower-layer interaction layer corresponding to the corresponding interaction layer; and a third determination module, configured to determine a target association relationship corresponding to the front-end based on the intra-layer association relationships and the first inter-layer relationships corresponding to the multiple interaction layers respectively.

[0013] According to another aspect of this application, an electronic device is provided, comprising: one or more processors, a memory, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, the one or more programs including an element association determination method for performing any of the preceding front-ends.

[0014] According to another aspect of this application, a computer program product is provided, comprising: when the computer program is executed by a processor, the steps of implementing the method for determining the element association relationship of the front end as described in any one of the above claims.

[0015] In this embodiment of the invention, page data and script data of the front end are obtained, wherein the front end is used to perform interactive operations on the target object; based on the page data and script data, multiple interaction layers corresponding to the front end are determined, wherein for any two adjacent upper and lower interaction layers among the multiple interaction layers, the interaction function range corresponding to the lower interaction layer belongs to the interaction function range corresponding to the upper interaction layer, and the interaction element in the upper interaction layer includes at least one interaction element in the lower interaction layer; the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers are determined, wherein the intra-layer association relationship is the association relationship between the interaction elements within the corresponding interaction layer, and the first inter-layer relationship is the association relationship between the interaction element in the corresponding interaction layer and the lower element, where the lower element is the interaction element in the lower interaction layer corresponding to the corresponding interaction layer; based on the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers, the target association relationship corresponding to the front end is determined. By acquiring front-end page and script data, multiple interaction layers are identified. Adjacent layers satisfy the condition that the functional scope of the upper interaction layer includes the functional scope of the lower interaction layer, and that the interaction elements of the upper interaction layer contain at least one interaction element of the lower interaction layer. This achieves layer-by-layer decomposition of functional granularity and structured organization of front-end elements. Furthermore, by determining the intra-layer relationships (relationships between elements within the same layer) and the first-level inter-layer relationships (relationships between elements within the same layer and elements below), the interaction logic of elements at the same functional granularity and the inclusion and being-included logic of elements between different layers can be clearly defined. Based on the intra-layer relationships and the first-level inter-layer relationships, the front-end element relationship architecture can be comprehensively reflected, enabling accurate determination of the front-end's target relationships. This effectively avoids the technical problem of low development and maintenance efficiency caused by ambiguous element relationships, thus solving the technical problem of inaccurate element relationship determination leading to low development and maintenance efficiency in related technologies. Attached Figure Description

[0016] The accompanying drawings, which form part of this application, are used to provide a further understanding of this application. The illustrative embodiments and descriptions of this application are used to explain this application and do not constitute an undue limitation of this application. In the drawings:

[0017] Figure 1 A hardware structure block diagram of a mobile terminal for determining element association relationships of an execution front end, according to an embodiment of this application, is shown.

[0018] Figure 2 A flowchart illustrating a method for determining element association relationships in a front end according to an embodiment of this application is shown.

[0019] Figure 3 A schematic diagram of a hierarchical structure provided according to an embodiment of this application is shown;

[0020] Figure 4 A structural block diagram of a front-end element association determination device provided according to an embodiment of this application is shown.

[0021] The above figures include the following reference numerals:

[0022] 102. Processor; 104. Memory; 106. Transmission device; 108. Input / output device. Detailed Implementation

[0023] It should be noted that, unless otherwise specified, the embodiments and features described in this application can be combined with each other. This application will now be described in detail with reference to the accompanying drawings and embodiments.

[0024] To enable those skilled in the art to better understand the present application, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present application, and not all embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative effort should fall within the scope of protection of the present application.

[0025] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate for the embodiments of this application described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.

[0026] It should be noted that the data and information obtained in this application are all information and data that have been fully authorized by users, and the collection, storage, use, processing, transmission, provision, disclosure, and application of related data or information all comply with the conditions and permissions for data or information processing, necessary confidentiality measures have been taken, and corresponding operation entry points are provided for users to choose to authorize or refuse. For the results of automated decision-making, corresponding operation entry points are also provided for users to choose to agree to or refuse the results of automated decision-making; if the user chooses to refuse, the operations and processing related to automated decision-making will not be executed.

[0027] The technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings in the embodiments of the present invention.

[0028] The methods and embodiments provided in this application can be executed on a mobile terminal, computer terminal, or similar computing device. Taking running on a mobile terminal as an example, Figure 1 A hardware structure block diagram of a mobile terminal providing a method for determining element association relationships in an execution front end according to an embodiment of this application is shown. Figure 1 As shown, a mobile terminal may include one or more ( Figure 1 Only one is shown in the diagram. A processor 102 (which may include, but is not limited to, a microprocessor MCU or a programmable logic device FPGA, etc.) and a memory 104 for storing data are also shown. The mobile terminal may further include a transmission device 106 for communication functions and an input / output device 108. Those skilled in the art will understand that... Figure 1 The structure shown is for illustrative purposes only and does not limit the structure of the mobile terminal described above. For example, the mobile terminal may also include components that are more... Figure 1 The more or fewer components shown, or having the same Figure 1 The different configurations shown.

[0029] The memory 104 can be used to store computer programs, such as application software programs and modules, like the computer program corresponding to the element association determination method in the front end of this embodiment. The processor 102 executes various functional applications and data processing by running the computer program stored in the memory 104, thereby implementing the above-described method. The memory 104 may include high-speed random access memory and non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory 104 may further include memory remotely located relative to the processor 102, and these remote memories can be connected to the mobile terminal via a network. Examples of the aforementioned networks include, but are not limited to, the Internet, corporate intranets, local area networks, mobile communication networks, and combinations thereof. The transmission device 106 is used to receive or send data via a network. Specific examples of the aforementioned networks may include wireless networks provided by the mobile terminal's communication provider. In one example, the transmission device 106 includes a network interface controller (NIC), which can be connected to other network devices via a base station to communicate with the Internet. In one example, the transmission device 106 may be a radio frequency (RF) module, which is used to communicate with the Internet wirelessly.

[0030] This embodiment provides a method for determining element association relationships that runs on the front end of a mobile terminal, computer terminal, or similar computing device. It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions. Furthermore, although a logical order is shown in the flowchart, in some cases, the steps shown or described may be executed in a different order than that shown here.

[0031] Figure 2 A flowchart illustrating a method for determining element association relationships in a front-end system according to an embodiment of this application is shown. Figure 2 As shown, the method includes the following steps:

[0032] S202, obtain the front-end page data and script data, where the front-end is used to perform interactive operations on the target object.

[0033] In step S202 of this application, the front-end page data and script data are obtained.

[0034] This involves the front end, which in this context refers to the web page or application interface that the target object (such as a user) directly interacts with, encompassing visual elements and how these elements respond to the target object's actions.

[0035] This involves page data, which consists of all the static resource data that make up the content of a webpage, and is used to reflect the layout, structure, style, and appearance of the page.

[0036] This involves script data, which is the code used in the front-end system to implement dynamic functions and interactive logic. This script data is used to implement dynamic page interactions, such as event handling, data validation, and asynchronous requests.

[0037] This involves the target object, which is the object that performs interactive operations in the front-end system, such as the user.

[0038] This involves interactive operations, which are the interaction actions between the target object and the front-end system to trigger specific functions or responses from the front-end.

[0039] Page data provides static layout, structure, and style information for web pages, ensuring an accurate understanding of the visual elements and overall architecture of the front-end interface. Script data, on the other hand, covers dynamic interaction logic, including event handling, data validation, and asynchronous requests, clearly defining the dynamic relationships and behavioral response mechanisms between various interactive elements. Obtaining both front-end page and script data provides a stronger data foundation for a comprehensive and structured analysis of front-end interaction logic.

[0040] S204. Based on the page data and script data, determine multiple interaction layers corresponding to the front end. For any two adjacent upper and lower interaction layers, the interaction function range of the lower interaction layer belongs to the interaction function range of the upper interaction layer, and the interaction elements in the upper interaction layer include at least one interaction element in the lower interaction layer.

[0041] In step S204 of this application, multiple interaction layers corresponding to the front end are determined based on page data and script data.

[0042] This involves multiple interaction layers, which are different hierarchical structures in the front-end system divided according to functional granularity. These layers are progressively refined from macro to micro, reflecting the layered interaction logic of the front-end system. For example, from the page layer to the functional module layer, and then to the specific interactive element layer.

[0043] This involves an upper-level interaction layer, which is the interaction layer with a broader scope of functionality and a higher level of abstraction among any two adjacent interaction layers. Taking the page layer and module layer as examples, the corresponding upper-level interaction layer is the page layer.

[0044] This involves a lower-level interaction layer, which is the interaction layer with a relatively smaller functional scope and lower level of abstraction among any two adjacent interaction layers. It is a refinement of the upper-level interaction layer. Taking the page layer and module layer as examples of any two adjacent interaction layers, then the corresponding upper-level interaction layer is the module layer. The interaction functionality of the lower-level interaction layer is within the interaction functionality of the upper-level interaction layer; that is, the upper-level interaction layer contains the lower-level interaction layer, and the interactive elements in the upper-level interaction layer include at least one interactive element from the lower-level interaction layer.

[0045] This involves the scope of interactive functions, which is the set of all interactive functions covered by the interaction layer. For example, the scope of interactive functions in the page layer includes functions such as user login, registration, and browsing, while the scope of interactive functions in the functional module layer only includes the specific functions of the login module or the registration module.

[0046] This involves interactive elements, which are specific elements on the front-end interface that can interact with the user. These elements are the basic building blocks of the interaction layer, implementing dynamic interactive functions through script data. In multiple interaction layers, each upper-level interaction layer contains at least one interactive element from a lower-level interaction layer. These elements form a containment relationship between different levels, thus constituting the hierarchical interaction structure of the front-end page. For example, for the page layer, interactive elements could be Page 1, Page 2, etc. For the module layer, interactive elements could be Module 1, Module 2, etc.

[0047] By dividing the front-end system into multiple interaction layers according to functional granularity, from the macro-level page layer to the micro-level interactive element layer, the functional scope is progressively refined. This ensures that the functional scope of the upper-level interaction layer includes the functional scope of the lower-level interaction layer, and that each upper-level interactive element contains at least one lower-level interactive element, thus forming an inclusive relationship. This layered structure not only avoids confusion in interaction logic caused by ambiguous functional scopes but also enables layer-by-layer decomposition of functional granularity, providing a clear hierarchical framework for subsequent relationship analysis, thereby improving the development and maintenance efficiency of the front-end system.

[0048] S206, determine the intra-layer association relationship and the first inter-layer relationship corresponding to multiple interaction layers respectively. The intra-layer association relationship is the association relationship between interactive elements within the corresponding interaction layer, and the first inter-layer relationship is the association relationship between interactive elements in the corresponding interaction layer and lower-level elements. The lower-level elements are the interactive elements in the lower-level interaction layer corresponding to the corresponding interaction layer.

[0049] In step S206 of this application, the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers are determined respectively.

[0050] This involves intra-layer relationships, which are the connections between interactive elements within the same interaction layer. These relationships reflect the logical and functional connections between elements at the same level. These intra-layer relationships can be represented using an adjacency list. One adjacency list is constructed for each interaction layer.

[0051] This involves the first layer relationship, which refers to the association between interactive elements in two adjacent interaction layers and their lower-level elements. Specifically, it reflects whether an interactive element in a given interaction layer contains, and if so, which one or more lower-level elements it contains. This first layer relationship can be represented using a hierarchical hash table.

[0052] By defining the intra-layer relationships within multiple interaction layers, we can clarify the logical and functional connections between interactive elements at the same level, ensuring the integrity and consistency of the interaction logic within a single level. At the same time, by clarifying the relationships between the first layer, we can reveal the relationships between interactive elements at adjacent levels, that is, the inclusion relationship between upper-level interactive elements and lower-level elements, ensuring the continuity and traceability of the interaction logic across different levels.

[0053] S208. Based on the intra-layer association relationships and inter-layer relationships corresponding to multiple interaction layers, determine the target association relationship with the front end.

[0054] In step S208 provided in this application, the target association relationship with the front end is determined based on the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers.

[0055] This involves target association relationships, which are the final and comprehensive relationships between all elements in the front-end system. It is a complete mapping of the logical, functional, and hierarchical relationships between all interactive elements in the front-end system, reflecting the interaction logic between elements at different levels.

[0056] By integrating the horizontal collaboration relationships between elements within a layer and the vertical calling relationships between elements between layers, the complete path from user operation to system response can be fully presented, ensuring the continuity and maintainability of the front-end interaction process, while providing structured data support for subsequent interaction optimization or function expansion.

[0057] In one optional approach, determining the target association relationship with the front end based on the intra-layer association relationships and the first inter-layer relationships corresponding to multiple interaction layers includes: determining the second inter-layer relationships corresponding to the multiple interaction layers, wherein the second inter-layer relationships are the association relationships between interactive elements in the corresponding interaction layer and their parent elements, and the parent elements are the interactive elements in the parent interaction layer corresponding to the corresponding interaction layer; and determining the target association relationship with the front end based on the intra-layer association relationships, the first inter-layer relationships, and the second inter-layer relationships corresponding to the multiple interaction layers.

[0058] This embodiment describes the specific steps for determining the target association relationship with the front end based on the intra-layer association relationships and inter-layer relationships corresponding to multiple interaction layers.

[0059] This involves a second layer relationship, which is a reverse association between interactive elements in the current interactive layer and their corresponding interactive elements in the upper interactive layer. It reflects how lower-level elements are contained or invoked by upper-level elements, and is a reverse layer relationship. This second layer relationship, together with the first layer relationship, constitutes a bidirectional hierarchical interaction chain. This second layer relationship can be represented using a reverse hash table.

[0060] This involves upper-level elements, which are interactive elements in the upper-level interaction layer that are directly adjacent to the current interaction layer.

[0061] By defining the second-level inter-layer relationships corresponding to multiple interaction layers, the reverse association between the current interaction layer element and the upper-level interaction layer element can be clarified, further completing the bidirectional interaction logic between layers. This ensures that the affiliation of each lower-level element is clear, avoiding functional redundancy or omissions caused by unclear hierarchical relationships. Thus, by combining intra-layer relationships, first-level inter-layer relationships, and second-level inter-layer relationships, the dynamic interaction logic and hierarchical structure between various elements in the front-end system can be comprehensively reflected, thereby achieving accurate modeling of the overall architecture of the front-end system. The determination of this bidirectional relationship not only improves the maintainability and development efficiency of the front-end but also ensures its stability and scalability.

[0062] In one optional approach, determining the intra-layer association relationships corresponding to multiple interaction layers includes: for any one of the multiple interaction layers, determining the intra-layer association relationship corresponding to any one interaction layer in the following manner: from the multiple interaction elements included in any interaction layer, determining the starting element corresponding to any one interaction layer; according to the execution order of the multiple interaction elements, determining the first co-level element corresponding to the starting element, and determining the first association relationship corresponding to any one interaction layer based on the starting element and the first co-level element, wherein the first co-level element is the interaction element among the multiple interaction elements that has a functional association relationship with the starting element; determining the next co-level element corresponding to the first co-level element, and determining the next association relationship corresponding to any one interaction layer based on the first co-level element and the next co-level element, until the target condition is met to obtain the intra-layer association relationship corresponding to any one interaction layer, wherein the target condition includes any one of the following: multiple interaction elements have been processed.

[0063] This embodiment describes the specific steps for determining the intra-layer association relationships corresponding to the multiple interaction layers.

[0064] This involves the starting point element, which is the interactive element that serves as the starting point for relationship analysis in the current interaction layer. This starting point element is the initial trigger point or core function entry point of the interaction process, such as the first operable button when the page loads.

[0065] This involves the execution order, which refers to the order in which interactive elements are triggered or executed in user operations or system logic.

[0066] This involves any one interaction layer, which is an arbitrary choice among multiple interaction layers, used to analyze the interactive elements within that layer and their relationships.

[0067] This involves the first association relationship, which is the functional dependency or triggering relationship between the starting element and the first directly related interactive element at the same level according to the execution order. It indicates that the two elements have a functional dependency or calling relationship.

[0068] This involves the first element at the same level, which is the first interactive element in the current interactive layer that has a direct functional relationship with the starting element.

[0069] This involves the next co-level element, which is an interactive element within the current interactive layer that has a direct functional relationship with the first co-level element.

[0070] This involves the next association relationship, which is the functional dependency or triggering relationship formed between the current element at the same level and its next element at the same level according to the execution order.

[0071] For any interaction layer among multiple interaction layers, by determining the starting element and sequentially determining the functional relationships with the starting element and subsequent elements in the same layer according to the execution order, a complete intra-layer association chain can be constructed. By connecting the elements in the same layer one by one to form a complete intra-layer association chain, all interaction logic of the layer can be covered. This enables a structured analysis and complete presentation of the functional collaboration relationships within the interaction layer, providing a comprehensive and reliable basis for the functional optimization and maintenance of the front-end system.

[0072] In one alternative approach, determining the next element in the same layer corresponding to the first element in the same layer includes: removing the starting element from multiple interactive elements to obtain multiple updated elements; and determining the next element in the same layer corresponding to the first element in the same layer from the multiple updated elements.

[0073] In this embodiment, the specific steps for determining the next element in the same layer corresponding to the first element in the same layer are described.

[0074] This involves multiple update elements, which are the set of unprocessed interaction elements remaining after removing the starting element that has been used as the starting point for analysis from all interaction elements in the current interaction layer. By excluding the analyzed nodes, it ensures that subsequent relationship analysis focuses on the untraversed elements, avoiding duplicate associations or logical loops.

[0075] Removing the starting element from multiple interactive elements to obtain the updated element, and then determining the next element at the same level from these updated elements, ensures that the relationship analysis focuses on the untraversed elements. This process avoids redundant associations and logical loops, thereby achieving high efficiency and accuracy in relationship analysis.

[0076] It should be noted that the process described above, which removes the already processed starting element from all interactive elements in the current interaction layer, is not deletion, but rather excluding it from subsequent traversal. This can be achieved by constructing a scanned hash table. For current interactive elements with established relationships (such as the starting element), the interactive element is added to the scanned hash table. When analyzing the next interactive element, interactive elements in the scanned hash table are not considered.

[0077] In one alternative approach, determining the starting element corresponding to any interaction layer from among the multiple interaction elements included in any interaction layer includes: when any interaction layer is the first layer among multiple interaction layers, determining the trigger positions corresponding to the multiple interaction elements in the any interaction layer; and determining the starting element from among the multiple interaction elements based on the trigger positions corresponding to the multiple interaction elements, wherein the starting element is the interaction element with the first trigger position among the multiple interaction elements.

[0078] In this embodiment, the specific steps for determining the starting element corresponding to any interaction layer from among the multiple interaction elements included in any interaction layer are described.

[0079] This involves the trigger position, which represents the sequential number of each interactive element within the current interaction layer that is triggered in the user operation flow or system execution logic.

[0080] When any interaction layer is the first of multiple interaction layers, determining the trigger position of multiple interaction elements can quantify the logical order of user operations or system execution. By determining the starting element based on the trigger position of multiple interaction elements, it can ensure that the analysis starts from the initial trigger point of the interaction process and avoid logical confusion or omissions caused by improper selection of the starting point.

[0081] In one optional approach, determining the target association with the front end based on the intra-layer associations and first inter-layer relationships corresponding to multiple interaction layers includes: determining first identifier parameters corresponding to each of the multiple interaction layers; for any one of the multiple interaction layers, determining second identifier parameters corresponding to each of the multiple interaction elements in that interaction layer; determining target identifier parameters corresponding to each of the multiple interaction layers based on the first identifier parameters corresponding to each of the multiple interaction layers and the second identifier parameters corresponding to each of the multiple interaction elements in the multiple interaction layers; and determining the target association with the front end based on the target identifier parameters corresponding to each of the multiple interaction layers, the intra-layer associations, and the first inter-layer relationships.

[0082] This embodiment describes the specific steps for determining the target association relationship with the front end based on the intra-layer association relationships and inter-layer relationships corresponding to multiple interaction layers.

[0083] This involves a first identifier parameter, which is used to uniquely identify the level of different interaction layers. This first identifier parameter can be a level identifier (level[i]), denoted as the first-level index.

[0084] This involves a second identifier parameter, which is used to uniquely identify each interactive element in each interaction layer. This second identifier parameter can be an element identifier (level[i][j]), denoted as a second-level index.

[0085] This involves a target identifier parameter, which is a comprehensive identifier used to uniquely identify a specific interactive element in each interaction layer. It is a globally unique identifier that clearly distinguishes different interactive elements in different interaction layers. This target identifier parameter can be implemented by constructing a global hash table, that is, represented by a hash key and the element's position (such as its position in the adjacency list). For example, a unique hash key (generated from the level number and element sequence number, such as hash(level[i][j])=i_j) is assigned globally for each level element, thus obtaining a global hash table that stores the element's position in the adjacency list.

[0086] By assigning a first identifier parameter to different interaction layers and a second identifier parameter to the interaction elements within each layer, a dual indexing system of layers and elements can be constructed. Based on this, a globally unique target identifier parameter can be generated, which can eliminate naming conflicts between elements across layers and ensure the unique locatability of each interaction node in the system. Finally, by combining the target identifier parameter, the intra-layer association relationship, and the inter-layer relationship, the target association relationship can be determined, which can realize the full-link tracking and dynamic mapping of the front-end interaction logic and avoid association errors or analysis omissions caused by ambiguity of layer or element identifiers.

[0087] In one alternative approach, before determining the intra-layer association and inter-layer relationship corresponding to the multiple interaction layers respectively, the method further includes: for any one of the multiple interaction layers, determining the execution logic parameters corresponding to the interaction layer, wherein the execution logic parameters are used to represent the interaction execution logic features corresponding to the interaction layer; and determining the multiple interaction elements corresponding to the interaction layer based on the execution logic parameters.

[0088] In this embodiment, the specific steps before determining the intra-layer associations and first inter-layer relationships corresponding to the multiple interaction layers are described.

[0089] This involves execution logic parameters, which are used to describe the execution logic of interactive elements in a certain interaction layer. They reflect the specific logical characteristics exhibited by the interactive elements during execution. These execution logic parameters can be used to distinguish the execution structure in each layer in order to divide the interactive elements.

[0090] Determining the execution logic parameters of any interaction layer can clearly reflect the specific logical characteristics of the interaction elements in that layer, accurately distinguish the execution structure in each interaction layer, ensure that the division of interaction elements conforms to logical and functional requirements, avoid confusion in the relationship caused by inaccurate division, and thus lay a reliable data foundation for the subsequent accurate construction of intra-layer and inter-layer relationships.

[0091] Through the above embodiments, by acquiring front-end page data and script data, multiple interaction layers are determined, and adjacent layers satisfy the condition that the functional scope of the upper interaction layer includes the functional scope of the lower interaction layer, and the interaction elements of the upper interaction layer include at least one interaction element of the lower interaction layer. This achieves layer-by-layer decomposition of functional granularity and structured organization of front-end elements. By determining the intra-layer relationships (relationships between elements within the layer) and the first inter-layer relationships (relationships between elements within the layer and elements in the lower layer), the interaction logic of elements at the same functional granularity and the inclusion and being-included logic of elements between different layers can be clearly defined. Based on the intra-layer relationships and the first inter-layer relationships, the front-end element relationship architecture can be comprehensively reflected, and the target relationship of the front-end can be accurately determined. This effectively avoids the technical problem of low development and maintenance efficiency of the front-end due to ambiguity in the element relationship of the front-end. Thus, it solves the technical problem in related technologies where inaccurate determination of element relationship of the front-end leads to low development and maintenance efficiency of the front-end.

[0092] To enable those skilled in the art to better understand the technical solution of this application, the implementation process of the method for determining the element association relationship of the front end of this application will be described in detail below with reference to specific embodiments.

[0093] This embodiment relates to a specific method for determining the element association relationship in a front-end, including the following steps:

[0094] S1: Obtain the front-end page data and script data, and determine multiple interaction layers corresponding to the front-end based on the page data and script data;

[0095] For any two adjacent upper and lower interaction layers in multiple interaction layers, the interaction function range corresponding to the lower interaction layer belongs to the interaction function range corresponding to the upper interaction layer. That is, the front-end page and script are divided into level[1] to level[N] layers according to the logical hierarchy to form an inclusive hierarchical structure.

[0096] Figure 3 A schematic diagram of a hierarchical structure provided according to an embodiment of this application is shown, such as... Figure 3 As shown, the upper layer (lower index) is the abstract scope layer, and the lower layer (higher index) is the refinement and decomposition layer of the upper layer, represented as: level[1] level[2] … level[N]. Furthermore, each interaction element in an upper interaction layer includes at least one interaction element in a lower interaction layer; that is, there is a one-to-many relationship between layers. Specifically, any element in the i-th interaction layer level[i] can contain one or more interaction elements (hereinafter referred to as elements) in the (i+1)-th layer level[i+1], the latter being a further logical decomposition of the former. Further, each interaction layer contains elements from the layer it belongs to; for example, layer level[i] includes level[i][1], level[i][2], ..., level[i][Q], where level[i][Q] represents the Q-th element in level[i]. For example:

[0097] Level[1] is the page layer, containing elements: page 1 (page-1), page 2 (page-2), ..., page N (page-N)), which serves as the highest abstract unit, and N is the total number of pages;

[0098] Level[2] is the functional module layer within the page, containing the following elements: module 1 (module-1), module 2 (module-2), ..., module M (module-M). Each page-x contains several modules, M is the total number of modules, and page-x represents the xth page.

[0099] level[3] is the layer of interactive elements within a module, containing elements such as: button1, input1, button2, etc. Each module contains several interactive elements, and so on.

[0100] S2, determine the intra-layer associations, first inter-layer relationships, and second inter-layer relationships corresponding to multiple interaction layers respectively;

[0101] Before determining the intra-layer relationships, inter-layer relationships, and inter-layer relationships corresponding to multiple interaction layers, the index relationships must first be determined. Specifically, a global hash table can be used to identify these relationships, including: using the level identifier (level[i]) as the first-level index and the element identifier (level[i][j]) as the second-level index to construct a mapping relationship between "element-lower-level element list". Each upper-level element (level[i][j]) corresponds to a dynamic linked list or array, storing the unique identifiers and associated attributes (such as weight and dependency type) of all its lower-level elements (level[i+1][k1], level[i+1][k2], ..., level[i+1][kj]). The unique identifier can be an element identifier (ID) or a feature code. A unique hash key (generated from the level number and element sequence number, such as hash(level[i][j])=i_j) is assigned globally for each level element, and a global hash table ElementIndex is constructed to store the position of the element in the adjacency list. Specifically, the construction process of the global hash table ElementIndex is as follows: An empty hash table is initialized; a unique element number is generated for each element at each level (i.e., each interaction level); the element number is used as the key, and the position information consisting of the element's level number and its own identifier is used as the value, and these are stored one by one in the hash table. Registration is completed by traversing all levels of elements, thus realizing the mapping relationship between the element's level and its specific identifier through its element number.

[0102] For the first-level inter-layer relationship, the first-level inter-layer relationship is the association between the interactive element in the corresponding interaction layer and the lower-level element. The lower-level element is the interactive element in the lower-level interaction layer corresponding to the corresponding interaction layer. Specifically, the first-level inter-layer relationship can be a hierarchical hash table. The construction process of the hierarchical hash table includes: initializing an empty hash table according to the level number (level[1] to level[N]), with each level (that is, each layer) corresponding to a sub-table (that is, each interaction layer corresponds to a sub-table). Assign an identifier to each element of each level as the key of the sub-table, and initialize its value to an empty list. When the lower-level element contained in the upper-level element is clear in any two interaction layers, store the number of the lower-level element and the contained attributes (such as type and priority) into the list of the corresponding upper-level element to form a nested mapping of "level → element → contained lower-level element". In this context, the upper-level element is the interaction layer with the smaller hierarchical number among any two interaction layers, meaning it has the larger functional scope. Conversely, the lower-level element is the interaction layer with the larger hierarchical number among any two interaction layers, meaning it has the smaller functional scope. The interaction layer to which the upper-level element belongs includes the interaction layer to which the lower-level element belongs.

[0103] For the second-level inter-level relationship, it refers to the association between interactive elements in the corresponding interaction layer and their parent elements. The parent elements are the interactive elements in the parent interaction layer corresponding to the corresponding interaction layer. Specifically, within the elements constructed using the aforementioned secondary index, a reverse index is added to record which parent elements each element contains. The second-level inter-level relationship can be a reverse hash table. The construction process of the reverse hash table includes: initializing an empty hash table, generating a unique number as the key for each element, and initializing the corresponding values ​​to an empty set (used to store the parent element numbers). When a parent element establishes a containment relationship with a lower element, the parent element's number is added to the set corresponding to the lower element in the reverse hash table, realizing a reverse mapping of "element → all parent elements containing it," supporting quick tracing of all related parent elements from the lower element.

[0104] Furthermore, at each layer, a page or script has already scanned a hash table, AlreadyScanHashTable[i], with a key-value structure. The key is defined as a natural number starting from 0, used to record the information of the elements scanned at the i-th layer, as well as the correspondence between the initialization interface and the subsequent scanning interface.

[0105] Furthermore, a jumpQueue[i] is constructed to record key-value pairs of transfer operations (jump links or jump syntax for implementing page redirection), used to record all jump or redirection information in the page. Its metastructure includes a key-value pair, where the key is the parent element number and the value is the destination page or script number, represented as:

[0106] Level[i][1]: value1->Level[i][2]: value2->……Level[i][j]: valuek->……

[0107] It should be noted that the current page (currentPage) is the page or script currently being traversed, the current element (currentElement) is the element currently being traversed, the current parent element (currentUpperElement) is the parent element of the element currently being traversed, and the back parent element (backUpperElement) is the parent element of the jump operation that leads to the current page.

[0108] For intra-layer associations, these are the associations between interactive elements within the corresponding interaction layer. Specifically, at each layer, a relational adjacency list structure AdjLists[i] is constructed to store and record the call topology relationships of elements within the i-th layer. That is, intra-layer associations can be represented by adjacency lists. Based on the above, combined with a bidirectional hash index structure (i.e., relationships between the first and second layers), a multi-level nested adjacency list is constructed. Each multi-level adjacency list corresponds to one adjacency list for each interaction layer, reflecting the logical relationships between elements within the same layer. By using the structural information of adjacent layers, the logical relationships within the same layer can be modeled.

[0109] Without loss of generality, we select any two adjacent levels (Level[i], Level[i+1]) and describe in detail the generation process of the relevant structure. That is, taking Level[i] as the upper level and Level[i+1] as the lower level as an example, we can construct the relationship structure between elements in each level according to any partitioning method through the following method, so as to analyze the logical relationship between elements in each level in detail.

[0110] Let Level[i] be the atomic module layer and Level[i+1] be the backend interface layer. An atomic module is a unit of execution triggered by a single atomic operation by the user or system. It is the smallest unit of execution in a frontend page or script; either all content within an atomic module is executed, or none is executed at all. In practice, a button is an atomic module (upper-level element). When the user clicks it, the logic behind the button is triggered, calling one or more backend interfaces (lower-level elements). The backend interface layer Level[i+1] is divided according to the backend interfaces called, and its elements include, for example, a query list interface and a verification interface. An element in the atomic module layer contains elements (interfaces) from one or more backend interface layers; for example, a button may contain calls to multiple backend interfaces.

[0111] First, scan all front-end pages or scripts (or obtain the aforementioned front-end page and script data). According to the atomic module partitioning criteria of Level[i], divide each page into several atomic modules based on its execution structure. The overall encoding is: Atomic Module 1 (Am1), Atomic Module 2 (Am2), ..., Atomic Module n (Amn) ... Here, each atomic module is also an element of Level[i]. Correspondingly, according to the partitioning rules of Level[i+1], find all back-end interface addresses, register all interface information in the interface information module, and encode them sequentially as interface i01, interface i02...interface i10, interface i12...interface imp (m>=0, p>=0). Here, each interface is also an element of Level[i+1].

[0112] Next, for any one of the multiple interaction layers, the intra-layer association corresponding to that interaction layer is determined as follows: From the multiple interaction elements included in that interaction layer, determine the starting element corresponding to that interaction layer; according to the execution order of the multiple interaction elements, determine the first co-level element corresponding to the starting element, and based on the starting element and the first co-level element, determine the first association corresponding to that interaction layer, where the first co-level element is the interaction element among the multiple interaction elements that has a functional association with the starting element; determine the next co-level element corresponding to the first co-level element, and based on the first co-level element and the next co-level element, determine the next association corresponding to that interaction layer, until the target condition is met, obtaining the intra-layer association corresponding to that interaction layer, where the target condition includes any one of the following: multiple interaction elements have been processed. Further, determining the next co-level element corresponding to the first co-level element includes: removing the starting element from the multiple interaction elements to obtain multiple update elements; and determining the next co-level element corresponding to the first co-level element from the multiple update elements. Specifically, this can be achieved by building a page or script that has scanned a hash table. The elements recorded in the scanned hash table are the elements that need to be removed, represented as:

[0113] AlreadyScanHashTable[i], AlreadyScanHashTable[i+1];

[0114] Each interaction layer has a scanned hash table to know which elements have been used and which have not, and to determine whether to delete or perform other operations. The scanned hash table has a key-value structure, where the key is defined as a natural number starting from 0. It is used to record the scanned interface information and the correspondence between the initial interface and the subsequently scanned interface.

[0115] Taking page redirection as an example, a jumpQueue[i] is constructed to record jump operations with key-value pairs. This queue records jump links or redirection syntax within a page or script. Its specific metastructure includes key-value pairs, where the key is the atomic module number and the value is the destination page number of the jump operation, represented as:

[0116] Am1:value1->Am2:value2->……Ami:valuei->……

[0117] Accordingly, `currentPage` refers to the page or script currently being traversed; `currentElement` refers to the element currently being traversed (in this scenario, the current element is an interface); `currentUpperElement` refers to the parent element currently being traversed (in this scenario, the atomic module is the parent element). The back-parent element `backUpperElement` is the atomic module containing the jump structure that leads to the current page. A transition operation is the process of moving from one element to another, typically a jump link or a specific jump syntax.

[0118] Determining the starting element corresponding to any given interaction layer from among its multiple interactive elements includes: when any interaction layer is the first of multiple interaction layers, determining the trigger position of each of the multiple interactive elements within that layer; and determining the starting element from among the multiple interactive elements based on their respective trigger positions, where the starting element is the interactive element with the first trigger position. For example:

[0119] The first element in Level[i+1] reached by the application is identified, which in this scenario is the first interface called, such as the login interface, defined as interface i0. i0 is recorded as the current element (currentElement) and registered in the interface adjacency list AdjLists[i+1] as the first vertex of the lower-level adjacency list. It is also registered in the lower-level scanned hash table AlreadyScanHashTable[i+1]. The atomic module containing interface i0 is set as the current upper-level element (currentUpperElement), and the page containing interface i0 is set as the currently scanned page (currentPage). The atomic module containing interface i0 is recorded as the first element of the upper-level adjacency list AdjLists[i] and registered in the upper-level scanned hash table AlreadyScanHashTable[i]. Table 1 shows the values ​​of the adjacency list and the scanned hash table. As shown in Table 1, the values ​​of the adjacency list and the scanned hash table are as follows:

[0120] Table 1

[0121]

[0122] Based on the above, Level[i] and Level[i+1] have a "trigger-triggered" relationship, establishing a logical linkage between the two adjacency lists.

[0123] For any interaction layer, determine the starting element corresponding to the interaction layer from among the multiple interaction elements; determine the first co-level element corresponding to the starting element according to the execution order of the multiple interaction elements, and determine the first association relationship corresponding to the interaction layer based on the starting element and the first co-level element; determine the next co-level element corresponding to the first co-level element, and determine the next association relationship corresponding to the interaction layer based on the first co-level element and the next co-level element, until the target condition is met, and obtain the intra-layer association relationship corresponding to the interaction layer. For example: Sequentially scan all other elements (atomic modules) on the current page or script, and use all scanned atomic modules as the successor nodes of the current parent element (currentUpperElement) module (initially Am0). Use the first sub-element (interface) sequentially scanned within other elements (atomic modules) as the successor node of the current element (currentElement), and update the AdjLists[i] and AdjLists[i+1] structures. Simultaneously, register the scanned atomic modules and interfaces in the scanned hash tables AlreadyScanHashTable[i] and AlreadyScanHashTable[i+1]. Then, sequentially scan the subsequent sub-elements (interfaces) within each parent element (atomic module) on the current page, adding them to AdjLists[i+1] and AlreadyScanHashTable[i+1] according to their order. If the page containing the current element (currentElement) (initially interface i0) has 3 atomic modules, and they are numbered as follows:

[0124] The new scenario (Am1) includes: interface i11 (validation of current user validity); interface i12 (creating a new scenario number).

[0125] List view (Am2), including: interface i11 (current user validity verification); interface i22 (list query interface);

[0126] Condition verification (Am3) includes: interface i31 (data verification interface); i32 (condition verification interface).

[0127] Then, the first interface of the three atomic modules is taken as the successor node of the current element (currentElement) (initially interface i0), i.e., i11, i31, and added to the adjacency list AlreadyScanHashTable[i+1]. These elements are then sequentially added to the hash table AlreadyScanHashTable[i+1]. The subsequent interfaces (i12, i22, i32) of the three atomic operations are then sequentially scanned and added to the two structures mentioned above. Table 2 shows the relevant structure of the Level[i+1] layer. As shown in Table 2, the relevant structure of the Level[i+1] layer is as follows:

[0128] Table 2

[0129]

[0130] At this point, the overall Level[i+1] topology (element activity graph) is represented as follows:

[0131] Interface 0 |-> Interface i11 |-> Interface i12

[0132] |-> Interface i22

[0133] |->Interface i31->Interface i32

[0134] Table 3 is a schematic diagram of the relevant structure of the Level[i] layer. As shown in Table 3, the relevant structure of the Level[i] layer is as follows:

[0135] Table 3

[0136]

[0137] The overall topology (element activity graph) of Level[i] at this point is represented as follows:

[0138] Am0->Am1

[0139] ->Am2

[0140] ->Am3

[0141] Current page: Page 0.

[0142] Furthermore, all transfer operations on the current page are scanned and added sequentially to the transfer operation record queue jumpQueue[i]. In the example above, if modules Am2 and Am3 contain jump links, Table 4 is a schematic table of all transfer operations on the current page, as shown in Table 4.

[0143] Table 4

[0144]

[0145] The jumpQueue[i] queue structure is recorded as follows:

[0146] Am2:Page1->Am3:Page2->

[0147] Further, based on the first transition operation on the current page, find the next page and set it as the current page (currentPage), i.e., Page1. The atomic module to which the transition operation belongs is used as the backUpperElement, i.e., the head element Am2 is used as the backUpperElement. Then, jumpQueue[i] is dequeued once, i.e., the head element Am2:Page1 is removed. Continue to build the various structures, specifically:

[0148] 1) Scan all atomic modules in the current page (currentPage), and treat all scanned atomic modules as successor nodes of the current parent element (currentUpperElement). Treat the first interface within each scanned atomic module (e.g., Am4, Am5) as the successor interface of the last interface in the backtracking atomic module (interface i22 in example 1). Repeat this process for each subsequent interface within all atomic modules of the current page, adding them sequentially to the AdjLists and AlreadyScanHashTable structures according to their order of appearance.

[0149] Based on the above example, add relevant attributes to Page1. Table 5 shows an example of adding relevant attributes to Page1.

[0150] Table 5

[0151]

[0152] For Level[i+1] layer, Table 6 is a schematic table of the updated structure of each layer, as shown in Table 6.

[0153] Table 6

[0154]

[0155] The overall topology (element activity graph) of layer Level[i+1] at this point is shown below:

[0156] Interface 0 |-> Interface i11 |-> Interface i12

[0157] |->Interface i22|->Interface i11->Interface i41

[0158] |->Interface i51->Interface i52

[0159] |->Interface i31->Interface i32

[0160] For Level[i], Table 7 is a schematic table of the updated structure of each Level[i] layer, as shown in Table 7.

[0161] Table 7

[0162]

[0163] The overall topology (element activity graph) of Level[i] at this point is shown below:

[0164] Am0->Am1

[0165] ->Am2|->Am4

[0166] |->Am5

[0167] ->Am3

[0168] Current scanned page: Page 1.

[0169] 2) If the current page Page1 has a transfer operation, add the transfer operation to the jumpQueue, modify the current page, backtrack the parent element, etc., and build the relevant structure; if there is no jump link, such as in the scenario in example 2, find the page corresponding to the backtracked parent element, start scanning downwards from the backtracked atomic module (Am2 in the previous example), find the next transfer operation, such as Am3 (jump 2: jumpPage2 (additional information page)), and continue to build the relevant structure until all pages have been scanned at least once.

[0170] Furthermore, in cases involving branch decisions, if a scenario with branch decisions exists in the page or script, it is considered a parallel processing scenario, and all branch elements are counted as direct successors of their preceding nodes in the adjacency list. Table 8 is a schematic diagram of the association structure of Level[x] and Level[x+1] layers, as shown in Table 8.

[0171] Table 8

[0172]

[0173] The local adjacency list structure AdjLists[x+1] constructed above can be represented as:

[0174] Level[x+1][n0]|->Level[x+1][n1]->Level[x+1][n2]->Level[x+1][n3]

[0175] That is, the three elements represented by branches n1-n3 are all considered as the direct successors of the preceding element n0.

[0176] Taking the two-layer division of atomic modules and backend interfaces as an example, the following examples further illustrate the situation. Table 9 is a schematic table of newly added scenarios, as shown in Table 9.

[0177] Table 9

[0178]

[0179] At this point, the local structure of AdjLists can be represented as: i11->ic1->ic2->ic3. That is, if i11 calls the other three interfaces, the other three interfaces are all considered direct successors of i11 in terms of adjacency.

[0180] Furthermore, in response to dynamic changes, that is, when the front-end page is modified, there may be changes to the relationships between certain layers. In this case, the calling relationships of the related layers are modified synchronously, including adding, deleting and modifying, so that the model can adapt to dynamic changes.

[0181] Continuing with the steps above, the method or device will construct the adjacency list structure AdjLists for each level of all front-end pages in the system, the scanned hash table AlreadyScanHashTable, and the topology (element activity graph). Furthermore, by calculating the difference between the initial partitioned element set and the scanned hash table set for a certain level, the unscanned element set can be obtained, thus revealing which elements are unlikely to be called or are unreachable.

[0182] Therefore, based on the foregoing description, the overall structure after modeling, that is, the target association relationship, can be represented as:

[0183] {

[0184] Global hash table ElementIndex<element number, element position>

[0185] Hierarchical hash table <hierarchical number, set of elements>

[0186] Reverse hash table <element ID, set of parent element IDs>

[0187] Relational adjacency list set {

[0188] AdjLists[1],AdjLists[2],AdjLists[3]……AdjLists[N]

[0189] }

[0190] Scanned hash table set {

[0191] AlreadyScanHashTable[1], AlreadyScanHashTable[2],…AlreadyScanHashTable[N]

[0192] }

[0193] The set of transfer operation record queues {jumpQueue[1], ..., jumpQueue[N]}

[0194] Current Page

[0195] Current element (currentElement)

[0196] The current parent element (currentUpperElement)

[0197] Backtracking to the parent element (backUpperElement)

[0198] }

[0199] The above model (i.e., the target association relationship) accurately records the inclusion relationships of elements between levels and provides efficient bidirectional query capabilities. Simultaneously, it determines the logical relationships of elements within any level, including call relationships and sequential access relationships, forming an adjacency list structure and a call relationship topology for each level. Through these steps, the front-end page and script elements are organized into a multi-layered progressive abstract model based on their logical boundaries and functional granularity. Furthermore, by constructing a global hash table ElementIndex<element number, element position>, a hierarchical hash table <level number, set of contained elements>, a reverse hash table <element number, set of parent element numbers>, a set of relationship adjacency lists, a set of scanned hash tables, and a set of transfer operation record queues, the front-end page or script is further decomposed and modeled, constructing a hierarchical topology model (i.e., the target association relationship).

[0200] It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions, and although a logical order is shown in the flowchart, in some cases the steps shown or described may be executed in a different order than that shown here.

[0201] This application also provides a front-end element association relationship determination device. It should be noted that this front-end element association relationship determination device can be used to execute the front-end element association relationship determination method provided in this application. This device is used to implement the above embodiments and preferred embodiments; details already described will not be repeated. As used below, the term "module" can refer to a combination of software and / or hardware that performs a predetermined function. Although the device described in the following embodiments is preferably implemented in software, hardware implementation, or a combination of software and hardware, is also possible and contemplated.

[0202] The following describes the front-end element association determination device provided in the embodiments of this application.

[0203] Figure 4 A structural block diagram of a front-end element association determination device according to an embodiment of this application is shown, such as... Figure 4 As shown, the device includes: an acquisition module 402, a first determination module 404, a second determination module 406, and a third determination module 408.

[0204] The acquisition module 402 is used to acquire page data and script data from the front end, wherein the front end is used for interactive operations on the target object; the first determination module 404, connected to the acquisition module 402, is used to determine multiple interaction layers corresponding to the front end based on the page data and script data, wherein for any two adjacent upper and lower interaction layers, the interaction function range corresponding to the lower interaction layer belongs to the interaction function range corresponding to the upper interaction layer, and the interaction elements in the upper interaction layer include at least one interaction element in the lower interaction layer; the second determination module 406... The first determining module 404, connected to the above-mentioned first determining module, is used to determine the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers respectively. The intra-layer association relationship is the association relationship between the interaction elements in the corresponding interaction layer, and the first inter-layer relationship is the association relationship between the interaction element in the corresponding interaction layer and the lower-level element. The lower-level element is the interaction element in the lower-level interaction layer corresponding to the corresponding interaction layer. The third determining module 408, connected to the above-mentioned second determining module 406, is used to determine the target association relationship corresponding to the front end based on the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers respectively.

[0205] The front-end element association determination device may further include a processor and a memory. The aforementioned acquisition module 402, first determination module 404, second determination module 406, and third determination module 408 are all stored as program units in the memory. The processor executes these program units stored in the memory to achieve the corresponding functions. All of the above modules reside in the same processor; alternatively, the modules may be located in different processors in any combination. The processor contains a kernel, which retrieves the corresponding program units from the memory. One or more kernels can be configured. By adjusting the kernel parameters, the technical problem in related technologies where inaccurate determination of element associations leads to low efficiency in front-end development and maintenance can be addressed. The memory may include non-permanent memory in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM. The memory includes at least one memory chip.

[0206] This invention provides an electronic device including one or more processors, a memory, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, and the one or more programs include an element association determination method for performing any of the above-mentioned front-ends.

[0207] This application also provides a computer program product, including a computer program, and a method for determining the element association relationship of the front end that implements any of the above when the computer program is executed by a processor.

[0208] It is evident that those skilled in the art will understand that the modules or steps of the present invention described above can be implemented using general-purpose computing devices. They can be centralized on a single computing device or distributed across a network of multiple computing devices. They can be implemented using computer-executable program code, thereby allowing them to be stored in a storage device for execution by a computing device. In some cases, the steps shown or described can be performed in a different order than those described herein, or they can be fabricated as separate integrated circuit modules, or multiple modules or steps can be fabricated as a single integrated circuit module. Thus, the present invention is not limited to any particular hardware and software combination. Those skilled in the art will understand that embodiments of this application can be provided as methods, systems, or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Moreover, this application can take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0209] This application is described with reference to flowchart illustrations and / or block diagrams according to embodiments of this application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart illustrations. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0210] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The functions specified in one or more boxes. These computer program instructions may also be loaded onto a computer or other programmable data processing apparatus to cause a series of operational steps to be performed on the computer or other programmable apparatus to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable apparatus for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0211] In a typical configuration, a computing device includes one or more processors (CPUs), input / output interfaces, network interfaces, and memory. Memory may include non-persistent memory in computer-readable media, random access memory (RAM), and / or non-volatile memory such as read-only memory (ROM) or flash RAM. Memory is an example of computer-readable media. Computer-readable media includes both permanent and non-persistent, removable and non-removable media that can store information by any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase-change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, disk storage or other magnetic storage devices, or any other non-transfer medium that can be used to store information that can be accessed by the computing device. As defined in this article, computer-readable media do not include transient media, such as modulated data signals and carrier waves.

[0212] The technical features of the embodiments described above can be combined in any way. For the sake of brevity, not all possible combinations of the technical features in the above embodiments are described. However, as long as the combination of these technical features does not contradict each other, it should be considered within the scope of this specification. It should also be noted that the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes the element.

[0213] As can be seen from the above description, the embodiments of this application achieve the following technical effects:

[0214] 1) Compared with related technologies, this invention combines layered abstraction with multi-dimensional data structures to achieve full-dimensional decomposition and structured presentation of front-end logic, providing fine-grained data support for all stakeholders. Specifically, this includes: enabling fine-grained understanding and in-depth analysis of front-end logic, improving the efficiency of front-end and back-end development collaboration; helping system operation and maintenance quickly locate problems and improving operation and maintenance efficiency; and reducing the risk of interface modification through full-dimensional decomposition, ensuring the stability of the system during iteration.

[0215] 2) Compared to related technologies, this invention leverages the rapid location capabilities of the global hash table ElementIndex and the upper-level association records of the reverse index to achieve efficient bidirectional tracing of "upper-level element → lower-level element" and "lower-level element → upper-level element". For forward tracing: through the mapping of "element-lower-level element list" in the hierarchical adjacency list, all lower-level elements contained in any upper-level element can be directly obtained, and the inclusion logic can be clearly defined through association attributes (such as dependency conditions). For reverse tracing: based on the "element-upper-level element set" of the reverse index record, all upper-level elements containing any lower-level element can be traced from any lower-level element, solving the pain point of "fuzzy child element ownership chain" in traditional structures. Thus, based on bidirectional full-link, the entire domain of hierarchical relationships is traceable, providing accurate data support for the analysis of the call chain of front-end elements.

[0216] 3) Compared to related technologies, this invention relies on the elastic storage characteristics of dynamic linked lists / arrays and the real-time synchronization mechanism of bidirectional hash indexes to support the dynamic addition, deletion, and modification of hierarchical elements and their containment relationships, and automatically maintains data consistency. When adding an element: location information is registered through ElementIndex, and the containment relationship list of the hierarchical adjacency list and the upper-level association of the reverse index are updated synchronously to ensure that the association between the new element and the existing hierarchy takes effect immediately. When deleting or modifying an element: the element's position is located through a hash table, and the containment relationship list of its level and the reverse index of associated elements are updated in conjunction, avoiding problems such as "deletion residue" and "relationship breakage" in traditional static structures. Thus, through the adaptive maintenance of dynamic hierarchical relationships, it adapts to scenarios with frequent front-end page iterations, achieving closed-loop management of hierarchical relationships through "change-synchronization-verification".

[0217] 4) Compared to related technologies, the hierarchical topology model of this invention can accurately depict the call relationships of each level of the front-end page and supports visualization. Horizontally, at the page level, it can construct the call sequence dependencies between pages (such as the order of calls) and the direct call links between pages and interfaces (such as the interface call path triggered by the page); at the interface level, it can map the call characteristics of the back-end interface (such as the call subject, call frequency, and call context), realizing a structured presentation of the call logic at each level. Vertically, through the nested structure of the hierarchical adjacency list and the hierarchical progressive inclusion relationship, it clearly presents the decomposition logic of elements from abstract to concrete. Furthermore, the hierarchical topology model, through multi-dimensional hierarchical deconstruction, can decompose the internal logical dependencies and external inclusion relationships of elements at each level of the front-end page, and realize the topological mapping of relationships based on the adjacency list and topological structure. This model supports multi-view visualization (such as a view of vertical inclusion relationships at each level, a view of horizontal call relationships at the same level, and a view of cross-level dependency propagation), comprehensively displaying the logical connections and structural characteristics of elements at each level. Furthermore, the hierarchical topology model can achieve precise location of redundant elements (such as pages, modules, or interfaces that have never been called) and inactive elements (such as interactive components that are defined but have no actual calling scenarios) at each level through the joint analysis of adjacency lists and scanned hash tables. This function provides direct data support for front-end scenario iteration (such as cleaning up redundant pages and refactoring modules) and operation and maintenance troubleshooting (such as tracing the source of failed interface calls), improving system iteration efficiency and stability.

[0218] 5) Compared with related technologies, this invention tracks indirect call chains across layers (such as the dependency propagation path of the page layer indirectly calling the interface layer through the module layer) by the inclusion relationship between layers, identifies the full-link dependency relationship such as "page-module-interface", helps to locate the impact scope of cross-layer changes (such as the impact of a module modification on related pages and interfaces), and detects unauthorized calls (such as an interactive element directly calling a sensitive backend interface) or abnormal call paths (such as unexpected cross-page interface reuse) by the call relationship of the interface layer in the topology. Combined with the inclusion relationship of layers, it traces the source of risk (such as a specific page, module or interactive element) to assist in security compliance verification.

[0219] 6) Compared with related technologies, the present invention, based on a hierarchical topology model and its constraint rules, enables explicit modeling of front-end processing logic and architectural elements, significantly improving the controllability of the system design process and providing technical support for multi-dimensional analysis in the requirements, development, and operation and maintenance stages.

[0220] The above description is merely a preferred embodiment of this application and is not intended to limit this application. Various modifications and variations can be made to this application by those skilled in the art. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the protection scope of this application.

Claims

1. A method for determining the element association relationship in a front-end, characterized in that, include: Obtain page data and script data from the front end, wherein the front end is used to perform interactive operations on the target object; Based on the page data and the script data, multiple interaction layers corresponding to the front end are determined. For any two adjacent upper and lower interaction layers among the multiple interaction layers, the interaction function range corresponding to the lower interaction layer belongs to the interaction function range corresponding to the upper interaction layer, and the interaction element in the upper interaction layer includes at least one interaction element in the lower interaction layer. Determine the intra-layer association relationship and the first inter-layer relationship corresponding to the plurality of interaction layers respectively, wherein the intra-layer association relationship is the association relationship between the interaction elements in the corresponding interaction layer, and the first inter-layer relationship is the association relationship between the interaction element in the corresponding interaction layer and the lower layer element, wherein the lower layer element is the interaction element in the lower interaction layer corresponding to the corresponding interaction layer. Based on the intra-layer association relationships and inter-layer relationships corresponding to the multiple interaction layers, the target association relationship corresponding to the front end is determined.

2. The method according to claim 1, characterized in that, The step of determining the target association relationship with the front end based on the intra-layer association relationships and inter-layer relationships corresponding to the multiple interaction layers includes: Determine the second inter-layer relationship corresponding to each of the plurality of interaction layers, wherein the second inter-layer relationship is the association relationship between the interaction elements in the corresponding interaction layer and the upper-layer element, and the upper-layer element is the interaction element in the upper-layer interaction layer corresponding to the corresponding interaction layer; Based on the intra-layer association relationships, inter-layer relationships, and inter-layer relationships corresponding to the multiple interaction layers, the target association relationship corresponding to the front end is determined.

3. The method according to claim 1, characterized in that, Determining the intra-layer association relationships corresponding to the multiple interaction layers respectively includes: For any one of the multiple interaction layers, the intra-layer association relationship corresponding to any one interaction layer is determined in the following way: From the multiple interactive elements included in any one interactive layer, determine the starting element corresponding to any one interactive layer; According to the execution order of the plurality of interactive elements, determine the first same-layer element corresponding to the starting element, and determine the first association relationship corresponding to any one of the interactive layers based on the starting element and the first same-layer element, wherein the first same-layer element is the interactive element among the plurality of interactive elements that has a functional association relationship with the starting element; Determine the next element in the same layer corresponding to the first element in the same layer, and based on the first element in the same layer and the next element in the same layer, determine the next association relationship corresponding to any interaction layer, until the target condition is met, and obtain the intra-layer association relationship corresponding to any interaction layer, wherein the target condition includes any one of the following: the multiple interaction elements have been processed.

4. The method according to claim 3, characterized in that, Determining the next element at the same level as the first element at the same level includes: Remove the starting element from the plurality of interactive elements to obtain a plurality of updated elements; From the plurality of updated elements, determine the next same-layer element corresponding to the first same-layer element.

5. The method according to claim 3, characterized in that, Determining the starting element corresponding to any interaction layer from among the multiple interaction elements included in any interaction layer includes: When any one of the interaction layers is the first layer among multiple interaction layers, determine the trigger positions corresponding to the multiple interaction elements in the given interaction layer. Based on the trigger positions corresponding to the multiple interactive elements, a starting element is determined from the multiple interactive elements, wherein the starting element is the interactive element with the first trigger position among the multiple interactive elements.

6. The method according to claim 1, characterized in that, The step of determining the target association relationship with the front end based on the intra-layer association relationships and inter-layer relationships corresponding to the multiple interaction layers includes: Determine the first identifier parameter corresponding to each of the plurality of interaction layers; For any one of the multiple interaction layers, determine the second identifier parameter corresponding to each of the multiple interaction elements in that interaction layer; Based on the first identifier parameters corresponding to the plurality of interaction layers respectively, and the second identifier parameters corresponding to the plurality of interaction elements respectively, the target identifier parameters corresponding to the plurality of interaction layers are determined. Based on the target identifier parameters corresponding to the multiple interaction layers, the intra-layer association relationship and the inter-layer relationship, the target association relationship corresponding to the front end is determined.

7. The method according to any one of claims 1 to 6, characterized in that, Before determining the intra-layer association and inter-layer relationship corresponding to the plurality of interaction layers, the method further includes: For any one of the plurality of interaction layers, determine the execution logic parameters corresponding to the interaction layer, wherein the execution logic parameters are used to represent the interaction execution logic features corresponding to the interaction layer. Based on the execution logic parameters, determine multiple interactive elements corresponding to any one of the interactive layers.

8. A front-end element association relationship determination device, characterized in that, include: The acquisition module is used to acquire page data and script data from the front end, wherein the front end is used to perform interactive operations on the target object; The first determining module is used to determine multiple interaction layers corresponding to the front end based on the page data and the script data. For any two adjacent upper and lower interaction layers among the multiple interaction layers, the interaction function range corresponding to the lower interaction layer belongs to the interaction function range corresponding to the upper interaction layer, and the interaction element in the upper interaction layer includes at least one interaction element in the lower interaction layer. The second determining module is used to determine the intra-layer association relationship and the first inter-layer relationship corresponding to the plurality of interaction layers respectively, wherein the intra-layer association relationship is the association relationship between the interaction elements in the corresponding interaction layer, and the first inter-layer relationship is the association relationship between the interaction element in the corresponding interaction layer and the lower layer element, wherein the lower layer element is the interaction element in the lower interaction layer corresponding to the corresponding interaction layer. The third determining module is used to determine the target association relationship with the front end based on the intra-layer association relationship and the first inter-layer relationship corresponding to the multiple interaction layers respectively.

9. An electronic device, characterized in that, include: One or more processors, a memory, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, the one or more programs including a method for performing an element association determination method for a front end as described in any one of claims 1 to 7.

10. A computer program product, comprising a computer program, characterized in that, When the computer program is executed by the processor, it implements the steps of the method for determining the element association relationship of the front end as described in any one of claims 1 to 7.