Page element labeling processing method and related equipment
By providing a page element annotation processing method without manually entering JS code, the problem of embedding annotation code in the prior art is solved, and a wider application scenario and convenient annotation editing management are achieved.
Patent Information
- Application Number
- CN202311319370.7
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2023-10-12
- Publication Date
- 2025-04-15
AI Technical Summary
In the prior art, using JS code to embed it into the website project directory or front-end page requires manual input, which has high requirements for the environment and operation and maintenance personnel, and limits its application.
Provides a page element labeling processing method, which collects page element information and displays pop-up windows in response to the startup of the annotation tool. Users can edit page element information, obtain edit information, and generate label items after confirmation. This method does not require manual input of JS code, which reduces the difficulty of embedding the annotation code.
It reduces the difficulty of embedding label codes in the page, expands the application scenarios, and allows users to easily edit and manage labels.
Smart Images

Figure CN119828921A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of computer and communication technology, and in particular to a page element annotation processing method and related equipment. Background Art
[0002] Nowadays, as browsers have become the core entrance to the Internet and office scenarios, websites usually use similar website JS (JavaScript) codes as annotation codes to embed them into website project directories or front-end pages in order to optimize user experience and functional interaction. They collect information about relevant users accessing the website through browsers to public network servers, and then perform relevant data screening and modeling for analysis.
[0003] However, using JS code to embed into the website project directory or front-end page requires relevant operation and maintenance personnel to manually enter the JS code, which has high requirements on the environment and operation and maintenance personnel, limiting its application. Summary of the invention
[0004] The embodiments of the present application provide a page element annotation processing method and related equipment, which can overcome the above-mentioned problems at least to a certain extent.
[0005] Other features and advantages of the present application will become apparent from the following detailed description, or may be learned in part by the practice of the present application.
[0006] According to one aspect of an embodiment of the present application, a method for processing page element annotation is provided, including: collecting page element information in response to the start of an annotation tool; displaying the page element information in a pop-up window; obtaining editing information in response to an editing operation on any page element information in the pop-up window; and generating an annotation item in response to confirmation of the editing information.
[0007] In some embodiments of the present application, in response to an editing operation on any page element information in the pop-up window, obtaining editing information specifically includes:
[0008] In response to an editing operation on any page element information in the pop-up window, jump to an editing page, wherein the editing page includes a plurality of editable items, and the editable items include configuration items and editing items;
[0009] In response to a user's editing operation on any one of the configuration items or the editing items in the editing page, the editing information is acquired.
[0010] In some embodiments of the present application, after generating the annotation item in response to the confirmation of the editing information, the method further includes:
[0011] In response to the entry of a page, collecting annotation items corresponding to the page;
[0012] Comparing the marked item with the previous record;
[0013] If the marked item is inconsistent with the previous record, report information is generated.
[0014] In some embodiments of the present application, if the marked item is inconsistent with the previous record, generating reporting information specifically includes:
[0015] If the marked item is inconsistent with the previous record, uploading the marked item to the cache area;
[0016] If the annotation items in the cache area meet the preset conditions, the reporting information is generated.
[0017] In some embodiments of the present application, in response to the entry of a page, collecting the annotation items corresponding to the page specifically includes:
[0018] In response to the page being entered, obtaining a page address corresponding to the page;
[0019] According to the page address, the annotation items corresponding to the page are collected.
[0020] In some embodiments of the present application, collecting the annotation items corresponding to the page according to the page address specifically includes:
[0021] Determine a corresponding acquisition mode according to the page address;
[0022] According to the collection mode, the annotation items corresponding to the page are collected.
[0023] In some embodiments of the present application, collecting the annotation items corresponding to the page according to the collection mode specifically includes:
[0024] If the acquisition mode is the first acquisition mode, in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are acquired;
[0025] If the acquisition mode is the second acquisition mode, in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are acquired;
[0026] If the acquisition mode is the third acquisition mode, then in response to a click operation on the pop-up window, all annotation items corresponding to the clicked element are acquired.
[0027] According to one aspect of an embodiment of the present application, a page element annotation processing device is provided, and the page element annotation processing device includes: an information collection module, which is used to collect page element information in response to the start of an annotation tool; a pop-up display module, which is used to display the page element information in a pop-up window; an editing information module, which is used to obtain editing information in response to an editing operation on any page element information in the pop-up window; an information confirmation module, which is used to generate an annotation item in response to confirmation of the editing information.
[0028] In some embodiments of the present application, the editing information module specifically includes: a page jump submodule, which is used to jump to the editing page in response to an editing operation on any page element information in the pop-up window, and the editing page contains multiple editable items, and the editable items include configuration items and editing items; an information acquisition submodule, which acquires the editing information in response to the user's editing operation on any of the configuration items or the editing items in the editing page.
[0029] In some embodiments of the present application, the page element annotation processing device also includes: an annotation collection module, which is used to collect annotation items corresponding to the page in response to the entry of the page; an annotation comparison module, which is used to compare the annotation items with previous records; and an information reporting module, which is used to generate reporting information if the annotation items are inconsistent with the previous records.
[0030] In some embodiments of the present application, the information reporting module specifically includes: a marking upload submodule, which is used to upload the marking item to the cache area if the marking item is inconsistent with the previous record; and an information generation submodule, which is used to generate reporting information if the marking item in the cache area meets preset conditions.
[0031] In some embodiments of the present application, the annotation collection module specifically includes: an address acquisition submodule, which is used to obtain the page address corresponding to the page in response to the entry of the page; and an annotation collection submodule, which is used to collect the annotation items corresponding to the page according to the page address.
[0032] In some embodiments of the present application, the annotation collection submodule specifically includes: a mode determination unit, used to determine the corresponding collection mode according to the page address; and an annotation collection unit, used to collect annotation items corresponding to the page according to the collection mode.
[0033] In some embodiments of the present application, the annotation collection unit is specifically used to perform: if the collection mode is the first collection mode, then in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are obtained; if the collection mode is the second collection mode, then in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are obtained; if the collection mode is the third collection mode, then in response to a click operation on the pop-up window, all annotation items corresponding to the clicked element are obtained.
[0034] According to one aspect of an embodiment of the present application, a computer-readable medium is provided, on which a computer program is stored. When the computer program is executed by a processor, the page element annotation processing method described in the above embodiment is implemented.
[0035] According to one aspect of an embodiment of the present application, an electronic device is provided, comprising: one or more processors; a storage device for storing one or more programs, wherein when the one or more programs are executed by the one or more processors, the one or more processors implement the page element annotation processing method as described in the above embodiments.
[0036] In the technical solutions provided by some embodiments of the present application, after starting the annotation tool, the page element information is collected by the annotation tool and displayed in a pop-up window, so that the user can directly trigger the editing operation on the page element information that needs to be edited according to the page element information displayed in the pop-up window, and edit various elements. During the user editing process, the editing information is obtained. After the user completes the editing, the annotation item is generated in response to the confirmation of the editing information. When embedding the annotation code in the website project directory or the front-end page, the embodiments of the present application do not need to enter the JS code, but only need to perform a simple editing operation on the corresponding page element information, which reduces the difficulty of embedding the annotation code in the page. At the same time, since there is no need to enter the JS code, there is no need for the page environment to embed the JS code, which greatly expands the application scenarios of embedding the annotation code in the website project directory or the front-end page, making it convenient for users to perform annotation editing and annotation management.
[0037] It should be understood that the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the present application. BRIEF DESCRIPTION OF THE DRAWINGS
[0038] The drawings herein are incorporated into the specification and constitute a part of the specification, showing embodiments consistent with the present application, and together with the specification, are used to explain the principles of the present application. Obviously, the drawings described below are only some embodiments of the present application, and for ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work. In the drawings:
[0039] Figure 1 A schematic diagram showing an exemplary system architecture to which the technical solution of the embodiments of the present application can be applied;
[0040] Figure 2 A schematic diagram of a process of page element annotation processing provided by an embodiment of the present application is shown.
[0041] Figure 3 Shown according to Figure 2 A specific implementation flow chart of step S300 in the page element annotation processing method shown in the corresponding embodiment.
[0042] Figure 4 A flow chart of another page element annotation processing method provided in an embodiment of the present application is shown.
[0043] Figure 5 Shown according to Figure 4 A specific implementation flow chart of step S500 in the page element annotation processing method shown in the corresponding embodiment.
[0044] Figure 6 Shown according to Figure 5 A specific implementation flow chart of step S520 in the page element annotation processing method shown in the corresponding embodiment.
[0045] Figure 7 Shown according to Figure 4 A specific implementation flow chart of step S700 in the page element annotation processing method shown in the corresponding embodiment.
[0046] Figure 8 Shown according to Figure 7 A specific implementation flowchart of step S710 in the page element annotation processing method shown in the corresponding embodiment.
[0047] Fig. 9 A schematic diagram of the structure of a page element annotation processing device provided in an embodiment of the present application is shown.
[0048] Fig.10 A schematic diagram of the structure of an electronic device provided in an embodiment of the present application is shown. DETAILED DESCRIPTION
[0049] Example embodiments will now be described more fully with reference to the accompanying drawings. However, example embodiments can be implemented in a variety of forms and should not be construed as limited to the examples set forth herein; rather, these embodiments are provided so that this application will be more comprehensive and complete and fully convey the concept of the example embodiments to those skilled in the art.
[0050] In addition, described feature, structure or characteristic can be combined in one or more embodiments in any suitable manner. In the following description, many specific details are provided to provide a full understanding of the embodiments of the present application. However, those skilled in the art will appreciate that the technical scheme of the present application can be put into practice without one or more of the specific details, or other methods, components, devices, steps, etc. can be adopted. In other cases, known methods, devices, realizations or operations are not shown or described in detail to avoid blurring the various aspects of the application.
[0051] The block diagrams shown in the accompanying drawings are merely functional entities and do not necessarily correspond to physically independent entities. That is, these functional entities may be implemented in software form, or in one or more hardware modules or integrated circuits, or in different networks and / or processor devices and / or microcontroller devices.
[0052] The flowcharts shown in the accompanying drawings are only exemplary and do not necessarily include all the contents and operations / steps, nor must they be executed in the order described. For example, some operations / steps can be decomposed, and some operations / steps can be combined or partially combined, so the actual execution order may change according to actual conditions.
[0053] Figure 1 A schematic diagram of an exemplary system architecture to which the technical solution of the embodiments of the present application can be applied is shown.
[0054] like Figure 1 As shown, the system architecture may include terminal devices (such as Figure 1 The embodiment of the present invention is a schematic diagram of a mobile phone 101, a tablet computer 102, a portable computer 103, a desktop computer, etc., a network 104, and a server 105. The network 104 is used to provide a medium for a communication link between the terminal device and the server 105. The network 104 may include various connection types, such as a wired communication link, a wireless communication link, etc.
[0055] It should be understood that Figure 1 The number of terminal devices, networks and servers in the embodiment is only for illustration. According to the implementation requirements, there may be any number of terminal devices, networks and servers. For example, the server 105 may be a server cluster composed of multiple servers.
[0056] The user can use the terminal device to interact with the server 105 through the network 104 to receive or send messages, etc. The server 105 can be a server that provides various services. For example, the user uses the terminal device 103 (or the terminal device 101 or 102) to send various operation instructions to the server 105, such as the annotation tool startup instruction. The server 105 can respond to the startup of the annotation tool, collect page element information; display the page element information in a pop-up window; respond to the editing operation of any page element information in the pop-up window, obtain the editing information; respond to the confirmation of the editing information, generate the annotation item.
[0057] It should be noted that the page element annotation processing method provided in the embodiment of the present application is generally executed by the server 105, and accordingly, the page element annotation processing device is generally set in the server 105. However, in other embodiments of the present application, the terminal device may also have similar functions as the server, so as to execute the page element annotation processing scheme provided in the embodiment of the present application.
[0058] The implementation details of the technical solution of the embodiment of the present application are described in detail below:
[0059] Figure 2 A flow chart of a method for processing page element annotation according to an embodiment of the present application is shown. The method for processing page element annotation can be executed by a server, which can be Figure 1 Refer to the server shown in . Figure 2 As shown, the page element annotation processing method at least includes:
[0060] Step S100, in response to the start of the annotation tool, collecting page element information.
[0061] Step S200, displaying the page element information in a pop-up window.
[0062] Step S300, in response to an editing operation on any page element information in the pop-up window, obtaining editing information.
[0063] Step S400: generating a marking item in response to confirmation of the editing information.
[0064] In an embodiment of the present application, after starting the annotation tool, the page element information is collected through the annotation tool and displayed in a pop-up window, so that the user can directly trigger the editing operation on the page element information that needs to be edited according to the page element information displayed in the pop-up window, and edit various elements. During the user editing process, the editing information is obtained. After the user completes the editing, the annotation item is generated in response to the confirmation of the editing information. When embedding the annotation code in the website project directory or the front-end page, the embodiment of the present application does not need to enter the JS code, but only needs to perform a simple editing operation on the corresponding page element information, which reduces the difficulty of embedding the annotation code in the page. At the same time, since there is no need to enter the JS code, there is no need for the page environment to embed the JS code, which greatly expands the application scenarios of embedding the annotation code in the website project directory or the front-end page, making it convenient for users to perform annotation editing and annotation management.
[0065] In step S100, after the application website is opened and the annotation tool is started, various functions will be displayed on the client. When the user triggers the annotation function through the client, the current page element information of the website is collected.
[0066] In step S200, after the page element information is collected, it is displayed to the user through the client.
[0067] In step S300, the user can trigger the editing function for any page element information in the pop-up window. At this time, the user can edit the annotations of the page element information, including adding, deleting and modifying the annotations of the page element information.
[0068] When users edit annotations, they can also perform highlighting and re-annotation operations. Specifically, after the user triggers the operation of adding path information or re-annotation, the server hides the pop-up window and activates the highlight logic of the corresponding element. After re-annotation, the pop-up window is displayed and the activated annotation item is changed.
[0069] Specifically, in some embodiments, the specific implementation of step S300 can be found in Figure 3 . Figure 3 is based on Figure 2 The detailed description of step S300 in the page element annotation processing method shown in the corresponding embodiment, in the page element annotation processing method, step S300 may include the following steps:
[0070] Step S310, in response to an editing operation on any page element information in the pop-up window, jump to an editing page, wherein the editing page includes a plurality of editable items, and the editable items include configuration items and editing items.
[0071] Step S320: acquiring the editing information in response to the user's editing operation on any of the configuration items or the editing items in the editing page.
[0072] In the embodiment of the present application, after the user triggers the editing function for any page element information, the page will jump to the editing page, which contains multiple editable items, including configuration items and editing items. The user first needs to configure the pop-up window to form configuration information, and then edit the pop-up window to form editing information. Finally, the server obtains the editing information during the user editing process based on the configuration information.
[0073] In the above embodiment, the configuration information may include event name, identity, address information, annotation type, and collection mode, etc. The event name, annotation type, and collection mode in the above configuration information are also editable items, which also constitute part of the edit information.
[0074] Specifically, the event name is the general name used to distinguish the annotated events; the identity identifier may include a tag UUID, which is a unique ID used to distinguish the annotated events and cannot be changed. During use, it can be decrypted and imported in the management background according to the UUID to form an annotation rule with the website Host as the primary key. If an existing annotation UUID is encountered, it will be replaced with the latest imported content; the annotation type includes ordinary events and compound events; the collection mode is the collection time, including the first collection mode, the second collection mode and the third collection mode. The address information is the address information corresponding to the annotated item. When the address information changes, the address information needs to be matched with the address information of the page. If the address information cannot be matched, the editing function will be grayed out. If the address information can be matched, the currently activated dom node will be highlighted and the attribute information will be verified.
[0075] The above-mentioned editing items may include application HOST, application absolute URL, element information, and selected editing items.
[0076] Among them, the application HOST is the HOST address of the current main site. The application absolute URL is the full URL of the current website. Users can edit it according to their needs. For example, if a certain position in the URL changes dynamically, it can be replaced by * to match the wildcard website URL address. The element information indicates the relevant information of the annotated element, including the element HOST, element absolute URL, element Xpath, and collected content. The element HOST is the HOST address of the main site of the current annotated element. The element absolute URL is the full URL of the website where the current element is located. Users can edit it according to their needs. For example, if a certain position in the URL changes dynamically, it can be replaced by * to match the wildcard website URL address. The element Xpath is the Xpath value of the current annotated element, which is used to locate the absolute front-end code position of the element. Users can edit it according to their needs to match more scenarios. Each time the Xpath is modified, the page element will be dynamically highlighted. The collected content is the content that can be collected by the current annotated element, including inner Text, href, etc. Multiple selections can be made, and each multiple-selected content will appear in pairs. Selecting the edit item is for the user to select the operation to be performed on the currently edited annotation information, including save, cancel, and re-annotate.
[0077] During the annotation process, you can also trigger the switch position component on the editing page to switch the annotation tool to the left or right position.
[0078] In step S400, after the user completes editing and confirms, a corresponding annotation item is generated.
[0079] In some embodiments of the present application, Figure 4 As shown, after step S400, the method further includes:
[0080] Step S500: in response to the entry of a page, collecting annotation items corresponding to the page.
[0081] Step S600: compare the marked item with the previous record.
[0082] Step S700: If the marked item is inconsistent with the previous record, report information is generated.
[0083] In an embodiment of the present application, after the annotation item is generated, the annotation item can be collected and reported during the user's use. Specifically, after the user enters the page, the collection operation of the page is triggered to collect the annotation item corresponding to the page. The annotation item is compared with the previous record. If the annotation item is inconsistent with the previous record, the report information is generated. If the annotation item is consistent with the previous record, it proves that there is no change and no report information is generated.
[0084] In step S500, when the user enters the page, the corresponding annotation items on the page can be obtained according to different strategies. In the strategy, the data collection strategy is configured for those organizations, users, devices, and application websites, and the required reporting frequency is issued. The client that receives the strategy will collect and temporarily store web page data when visiting the website in accordance with the strategy.
[0085] In some embodiments of the present application, a filtering component may be triggered, and the filtering component is used to filter and display only related annotation items according to the current page URL.
[0086] Specifically, in some embodiments, the specific implementation of step S500 can be found in Figure 5 . Figure 5 is based on Figure 4 The detailed description of step S500 in the page element annotation processing method shown in the corresponding embodiment, in the page element annotation processing method, step S500 may include the following steps:
[0087] Step S510: in response to the entry of a page, obtaining a page address corresponding to the page.
[0088] Step S520: collecting annotation items corresponding to the page according to the page address.
[0089] In an embodiment of the present application, after the page is marked, when the user enters the page, the corresponding marked items on the page can be obtained. Specifically, when the user accesses the page, the marked items corresponding to the page are collected according to the page address.
[0090] Specifically, in some embodiments, the specific implementation of step S520 can be found in Figure 6 . Figure 6 is based on Figure 5 The detailed description of step S520 in the page element annotation processing method shown in the corresponding embodiment, in the page element annotation processing method, step S520 may include the following steps:
[0091] Step S522: determining a corresponding acquisition mode according to the page address.
[0092] Step S524: collecting annotation items corresponding to the page according to the collection mode.
[0093] In this embodiment, the collection mode corresponding to each annotation item in the page is first determined according to the page address, so that the annotation item corresponding to the page is collected using the corresponding collection mode.
[0094] Specifically, in some embodiments, the specific implementation of step S524 can refer to the following embodiments. Figure 6The detailed description of step S524 in the page element annotation processing method shown in the corresponding embodiment, in the page element annotation processing method, step S524 may include the following steps:
[0095] If the acquisition mode is the first acquisition mode, then in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are obtained.
[0096] If the acquisition mode is the second acquisition mode, then in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are obtained.
[0097] If the acquisition mode is the third acquisition mode, then in response to a click operation on the pop-up window, all annotation items corresponding to the clicked element are acquired.
[0098] In an embodiment of the present application, in the first acquisition mode, acquisition is performed when the page is loaded or the page changes, that is, after the user completes editing the pop-up window, the page is refreshed and loaded, and acquisition is performed to obtain all editing information of the pop-up window.
[0099] In the second collection mode, the collection is also performed when the page is loaded or the page changes, but it can be collected as long as the page is updated, that is, after the user updates the pop-up window, all the editing information of the pop-up window can be obtained.
[0100] In the third collection mode, collection is performed after the user clicks, and all editing information corresponding to the element clicked by the user is collected.
[0101] Specifically, in the first acquisition mode, the steps of collecting the annotation items specifically include: if the acquisition mode is the first acquisition mode, in response to the completion operation of editing the pop-up window, obtaining the address information; if the address information changes, after the pop-up window is loaded, obtaining all the annotation items of the pop-up window.
[0102] Specifically, in the second acquisition mode, the collection steps of the annotation items specifically include: if the acquisition mode is the second acquisition mode, in response to the update operation of the pop-up window, updating the pop-up window; after the pop-up window update is loaded, obtaining all editing information of the pop-up window.
[0103] In an embodiment of the present application, after the user performs an update operation on the pop-up window, the pop-up window and the page are updated, and after the pop-up window and the page are updated and loaded, all editing information is obtained.
[0104] Specifically, in some embodiments, the specific implementation of step S700 can be found in Figure 7 . Figure 7 is based on Figure 4The detailed description of step S700 in the page element annotation processing method shown in the corresponding embodiment, in the page element annotation processing method, step S700 may include the following steps:
[0105] Step S710: if the marked item is inconsistent with the previous record, the marked item is uploaded to the cache area.
[0106] Step S720: If the marked items in the buffer area meet the preset conditions, report information is generated.
[0107] In the embodiment of the present application, if the marked item is inconsistent with the previous record, the marked item is first uploaded to the cache area, and the reporting information is generated after the marked item in the cache area meets the preset conditions, that is, the temporarily stored collection content meets the time requirement or the number requirement, and is reported to the management background storage according to a specific encryption channel. After the management background receives the massive web page collection content reported by the client, it decrypts and consumes the data, and associates and stores it according to the dimensions of organization, user, device, application website, etc., and then displays it in the log management or data center or puts it on disk for use.
[0108] In step S710, a marking item includes table class information, attribute type and path information. When it is confirmed that the marking item is inconsistent, the marking item can be classified according to the table class information, attribute type and path information, and then placed in the corresponding cache area according to the classification.
[0109] Specifically, in some embodiments, the specific implementation of step S710 can be found in Figure 8 . Figure 8 is based on Figure 7 The detailed description of step S710 in the page element annotation processing method shown in the corresponding embodiment, in the page element annotation processing method, step S710 may include the following steps:
[0110] Step S712: if the marked item is inconsistent with the previous record, determining the storage area corresponding to the marked item according to the table class information, attribute type and path information of the marked item.
[0111] Step S714: uploading the marked item to a corresponding storage area in a cache area according to the storage area corresponding to the marked item.
[0112] In an embodiment of the present application, a marking item includes table class information, attribute type and path information. When it is confirmed that the marking item is inconsistent, the marking item can be classified according to the table class information, attribute type and path information, and the storage area corresponding to the marking item can be determined, and then uploaded and stored according to the storage area.
[0113] In the process of storing and generating reporting information, if the full amount of path information data cannot be received due to timeout, data merging is performed.
[0114] In step S720, reporting information is generated when the marked item meets the preset conditions. There may be multiple preset conditions, such as the marked items in the cache reaching a preset threshold, the proportion of a certain type of marked items in the cache reaching a preset threshold, etc., which are not limited in this application.
[0115] In one embodiment, if the number of marked items corresponding to the same attribute type in the cache exceeds a predetermined threshold, reporting information is generated, and at the same time, the storage area corresponding to the attribute type is cleared.
[0116] In other embodiments of the present application, the user can trigger the export component to export the corresponding annotation items according to the event name. After the export, it is necessary to import it on the target page so that the client can check for duplicates, import new additions and updates according to the marked UUID.
[0117] The following describes an apparatus embodiment of the present application, which can be used to execute the page element annotation processing method in the above embodiment of the present application. For details not disclosed in the apparatus embodiment of the present application, please refer to the above embodiment of the page element annotation processing method of the present application.
[0118] Fig. 9 A block diagram of a page element annotation processing device according to an embodiment of the present application is shown.
[0119] Reference Fig. 9 As shown, a page element annotation processing device 900 according to an embodiment of the present application includes: an information collection module 910, a pop-up display module 920, an information editing module 930, and an information confirmation module 940.
[0120] Among them, the information collection module 910 is used to collect page element information in response to the start-up of the annotation tool; the pop-up display module 920 is used to display the page element information in a pop-up window; the editing information module 930 is used to obtain editing information in response to an editing operation on any page element information in the pop-up window; the information confirmation module 940 is used to generate an annotation item in response to the confirmation of the editing information.
[0121] In some embodiments of the present application, the editing information module specifically includes: a page jump submodule, which is used to jump to the editing page in response to an editing operation on any page element information in the pop-up window, and the editing page contains multiple editable items, and the editable items include configuration items and editing items; an information acquisition submodule, which acquires the editing information in response to the user's editing operation on any of the configuration items or the editing items in the editing page.
[0122] In some embodiments of the present application, the page element annotation processing device also includes: an annotation collection module, which is used to collect annotation items corresponding to the page in response to the entry of the page; an annotation comparison module, which is used to compare the annotation items with previous records; and an information reporting module, which is used to generate reporting information if the annotation items are inconsistent with the previous records.
[0123] In some embodiments of the present application, the information reporting module specifically includes: a marking upload submodule, which is used to upload the marking item to the cache area if the marking item is inconsistent with the previous record; and an information generation submodule, which is used to generate reporting information if the marking item in the cache area meets preset conditions.
[0124] In some embodiments of the present application, the annotation collection module specifically includes: an address acquisition submodule, which is used to obtain the page address corresponding to the page in response to the entry of the page; and an annotation collection submodule, which is used to collect the annotation items corresponding to the page according to the page address.
[0125] In some embodiments of the present application, the annotation collection submodule specifically includes: a mode determination unit, used to determine the corresponding collection mode according to the page address; and an annotation collection unit, used to collect annotation items corresponding to the page according to the collection mode.
[0126] In some embodiments of the present application, the annotation collection unit is specifically used to perform: if the collection mode is the first collection mode, then in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are obtained; if the collection mode is the second collection mode, then in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are obtained; if the collection mode is the third collection mode, then in response to a click operation on the pop-up window, all annotation items corresponding to the clicked element are obtained.
[0127] In the technical solutions provided by some embodiments of the present application, after starting the annotation tool, the page element information is collected by the annotation tool and displayed in a pop-up window, so that the user can directly trigger the editing operation on the page element information that needs to be edited according to the page element information displayed in the pop-up window, and edit various elements. During the user editing process, the editing information is obtained. After the user completes the editing, the annotation item is generated in response to the confirmation of the editing information. When embedding the annotation code in the website project directory or the front-end page, the embodiments of the present application do not need to enter the JS code, but only need to perform a simple editing operation on the corresponding page element information, which reduces the difficulty of embedding the annotation code in the page. At the same time, since there is no need to enter the JS code, there is no need for the page environment to embed the JS code, which greatly expands the application scenarios of embedding the annotation code in the website project directory or the front-end page, making it convenient for users to perform annotation editing and annotation management.
[0128] Fig.10 A schematic diagram of the structure of a computer system suitable for implementing an electronic device of an embodiment of the present application is shown.
[0129] It should be noted that Fig.10 The computer system of the electronic device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present application.
[0130] like Fig.10 As shown, the computer system includes a central processing unit (CPU) 1801, which can perform various appropriate actions and processes according to the program stored in the read-only memory (ROM) 1802 or the program loaded from the storage part 1808 to the random access memory (RAM) 1803, such as executing the method described in the above embodiment. In RAM 1803, various programs and data required for system operation are also stored. CPU 1801, ROM 1802 and RAM 1803 are connected to each other through bus 1804. Input / output (I / O) interface 1805 is also connected to bus 1804.
[0131] The following components are connected to the I / O interface 1805: an input section 1806 including a keyboard, a mouse, etc.; an output section 1807 including a cathode ray tube (CRT), a liquid crystal display (LCD), etc., and a speaker, etc.; a storage section 1808 including a hard disk, etc.; and a communication section 1809 including a network interface card such as a LAN (Local Area Network) card, a modem, etc. The communication section 1809 performs communication processing via a network such as the Internet. A drive 1810 is also connected to the I / O interface 1805 as needed. A removable medium 1811, such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc., is installed on the drive 1810 as needed so that a computer program read therefrom is installed into the storage section 1808 as needed.
[0132] In particular, according to an embodiment of the present application, the process described above with reference to the flowchart can be implemented as a computer software program. For example, an embodiment of the present application includes a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a computer program for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from a network through a communication section 1809, and / or installed from a removable medium 1811. When the computer program is executed by a central processing unit (CPU) 1801, various functions defined in the system of the present application are executed.
[0133] It should be noted that the computer-readable medium shown in the embodiment of the present application may be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may be, for example, - but not limited to - an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM), a flash memory, an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present application, a computer-readable storage medium may be any tangible medium containing or storing a program, which may be used by an instruction execution system, device or device or used in combination with it. In the present application, a computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, wherein a computer-readable computer program is carried. Such propagated data signals may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. Computer-readable signal media may also be any computer-readable medium other than computer-readable storage media, which may send, propagate, or transmit programs for use by or in conjunction with an instruction execution system, apparatus, or device. The computer program contained on the computer-readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wired, etc., or any suitable combination of the above.
[0134] The flowchart and block diagram in the accompanying drawings illustrate the possible architecture, functions and operations of the system, method and computer program product according to various embodiments of the present application. Wherein, each box in the flowchart or block diagram can represent a module, a program segment, or a part of the code, and the above-mentioned module, program segment, or a part of the code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order from the order marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram or flowchart, and the combination of boxes in the block diagram or flowchart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.
[0135] The units involved in the embodiments described in this application may be implemented by software or hardware, and the units described may also be set in a processor. The names of these units do not, in some cases, constitute limitations on the units themselves.
[0136] As another aspect, the present application also provides a computer-readable medium, which may be included in the electronic device described in the above embodiment; or may exist independently without being assembled into the electronic device. The above computer-readable medium carries one or more programs, and when the above one or more programs are executed by an electronic device, the electronic device implements the method described in the above embodiment.
[0137] It should be noted that, although several modules or units of the equipment for action execution are mentioned in the above detailed description, this division is not mandatory. In fact, according to the embodiments of the present application, the features and functions of two or more modules or units described above can be embodied in one module or unit. On the contrary, the features and functions of one module or unit described above can be further divided into being embodied by multiple modules or units.
[0138] Through the description of the above implementation methods, it is easy for those skilled in the art to understand that the example implementation methods described here can be implemented by software or by combining software with necessary hardware. Therefore, the technical solution according to the implementation methods of the present application can be embodied in the form of a software product, which can be stored in a non-volatile storage medium (which can be a CD-ROM, a USB flash drive, a mobile hard disk, etc.) or on a network, and includes several instructions to enable a computing device (which can be a personal computer, a server, a touch terminal, or a network device, etc.) to execute the method according to the implementation methods of the present application.
[0139] Those skilled in the art will readily appreciate other embodiments of the present application after considering the specification and practicing the embodiments disclosed herein. The present application is intended to cover any variations, uses or adaptations of the present application, which follow the general principles of the present application and include common knowledge or customary technical means in the art that are not disclosed in the present application.
[0140] It should be understood that the present application is not limited to the precise structures that have been described above and shown in the drawings, and that various modifications and changes may be made without departing from the scope thereof. The scope of the present application is limited only by the appended claims.
Claims
1. A page element annotation processing method, characterized in that: include: In response to the initiation of the annotation tool, collecting page element information; Displaying the page element information in a pop-up window; In response to an editing operation on any page element information in the pop-up window, acquiring editing information; In response to confirmation of the edit information, a marked item is generated.
2. The page element annotation processing method according to claim 1, characterized in that: The acquiring of editing information in response to an editing operation on any page element information in the pop-up window specifically includes: In response to an editing operation on any page element information in the pop-up window, jump to an editing page, wherein the editing page includes a plurality of editable items, and the editable items include configuration items and editing items; In response to a user's editing operation on any one of the configuration items or the editing items in the editing page, the editing information is acquired.
3. The page element annotation processing method according to claim 1, characterized in that: After generating the annotation item in response to the confirmation of the editing information, the method further includes: In response to the entry of a page, collecting annotation items corresponding to the page; Comparing the marked item with the previous record; If the marked item is inconsistent with the previous record, report information is generated.
4. The page element annotation processing method according to claim 3, characterized in that: If the marked item is inconsistent with the previous record, generating reporting information specifically includes: If the marked item is inconsistent with the previous record, uploading the marked item to the cache area; If the annotation items in the cache area meet the preset conditions, the reporting information is generated.
5. The page element annotation processing method according to claim 3, characterized in that: In response to the page being entered, collecting the annotation items corresponding to the page specifically includes: In response to the page being entered, obtaining a page address corresponding to the page; According to the page address, the annotation items corresponding to the page are collected.
6. The page element annotation processing method according to claim 5, characterized in that: The collecting of annotation items corresponding to the page according to the page address specifically includes: Determine a corresponding acquisition mode according to the page address; According to the collection mode, the annotation items corresponding to the page are collected.
7. The page element annotation processing method according to claim 6, characterized in that: The collecting of the annotation items corresponding to the page according to the collection mode specifically includes: If the acquisition mode is the first acquisition mode, in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are acquired; If the acquisition mode is the second acquisition mode, in response to an update operation on the pop-up window, after the pop-up window is loaded, all annotation items of the pop-up window are acquired; If the acquisition mode is the third acquisition mode, then in response to a click operation on the pop-up window, all annotation items corresponding to the clicked element are acquired.
8. A page element annotation processing device, characterized in that: The page element annotation processing device comprises: An information collection module, for collecting page element information in response to the activation of the annotation tool; A pop-up window display module, used to display the page element information in a pop-up window; An editing information module, used for obtaining editing information in response to an editing operation on any page element information in the pop-up window; The information confirmation module is used to generate a marking item in response to the confirmation of the editing information.
9. A computer readable medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the page element annotation processing method according to any one of claims 1 to 7 is implemented.
10. An electronic device, characterized in that: include: one or more processors; A storage device for storing one or more programs, which, when executed by the one or more processors, enables the one or more processors to implement the page element annotation processing method as described in any one of claims 1 to 7.