Webpage icon processing method and device, storage medium and electronic equipment

CN115904167BActive Publication Date: 2026-08-28CAXA TECH
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202211422910.X
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2022-11-14
Publication Date
2026-08-28
Estimated Expiration
2042-11-14

AI Technical Summary

Technical Problem

[0005]本发明实施例提供了一种网页图标的处理方法、装置、存储介质及电子设备,以至少解决现有技术中无法将字符串格式的图标资源转换为可缩放矢量图形SVG格式的图标资源,导致用户无法实现自定义改变网页图标,从而影响用户体验的技术问题

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN115904167B_ABST
    Figure CN115904167B_ABST
Patent Text Reader

Abstract

The application discloses a webpage icon processing method and device, a storage medium and electronic equipment, and relates to the technical field of webpage icons. The method comprises the following steps: detecting whether an icon identifier of a to-be-displayed icon is contained in an icon set of a target webpage; if the icon set does not contain the icon identifier, detecting whether the icon identifier is contained in a document object model of the target webpage; if the document object model does not contain the icon identifier, obtaining icon code data of the to-be-displayed icon from a network server, generating an icon resource of the to-be-displayed icon based on the icon code data, and displaying the to-be-displayed icon in the target webpage based on the icon resource; if the icon set contains the icon identifier or the document object model contains the icon identifier, obtaining a target scalable vector graphics (SVG) according to the icon identifier, and displaying the to-be-displayed icon in the target webpage based on the target SVG. The application solves the technical problem that a user cannot change a webpage icon as desired, thereby affecting user experience.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of computer technology, and more specifically, to a method, apparatus, storage medium, and electronic device for processing web page icons. Background Technology

[0002] Currently, related technologies use Scalable Vector Graphics (SVG) images to display icons on web pages. This method integrates locally stored SVG image resources and converts them into icons, which can well meet the needs of changing the size of icons on web pages.

[0003] However, in actual webpage use, users sometimes want to customize the icons on the webpage (e.g., add a specific icon). When users don't have SVG image resources locally, this customization is impossible. Furthermore, because current technology cannot convert string-format icon resources into scalable vector graphics (SVG) format icon resources, users cannot customize webpage icons by obtaining string-format icon resources, thus negatively impacting the user experience.

[0004] There is currently no effective solution to the above problems. Summary of the Invention

[0005] This invention provides a method, apparatus, storage medium, and electronic device for processing web page icons, at least to solve the technical problem in the prior art that string-formatted icon resources cannot be converted into scalable vector graphics (SVG) format icon resources, resulting in users being unable to customize web page icons and thus affecting user experience.

[0006] According to one aspect of the present invention, a method for processing webpage icons is provided, comprising: detecting whether an icon set of a target webpage contains an icon identifier for an icon to be displayed; if the icon set does not contain an icon identifier, detecting whether the document object model of the target webpage contains an icon identifier; if the document object model does not contain an icon identifier, obtaining icon code data of the icon to be displayed from a web server, generating an icon resource of the icon to be displayed based on the icon code data, and displaying the icon to be displayed on the target webpage based on the icon resource, wherein the icon code data is data in string format; if the icon set contains an icon identifier or the document object model contains an icon identifier, obtaining a target scalable vector graphics SVG based on the icon identifier, and displaying the icon to be displayed on the target webpage based on the target scalable vector graphics SVG.

[0007] Furthermore, the method for processing webpage icons also includes: constructing a code data processor according to a preset constructor; and converting the icon code data based on the code data processor to obtain icon resources.

[0008] Furthermore, the method for processing web page icons also includes: removing target data from the icon code data to obtain target source code data; performing format conversion processing on the target source code data based on the code data processor to obtain the document object of the Scalable Vector Graphics (SVG) file; and processing the attribute information of the document object of the SVG file to obtain the icon resource.

[0009] Furthermore, the method for processing web page icons also includes: removing the styles and colors of the document object in the SVG file to obtain icon resources.

[0010] Furthermore, the method for processing webpage icons also includes: obtaining the location information of the reserved space for the icon to be displayed on the target webpage; determining the display position of the icon to be displayed on the target webpage based on the location information; and displaying the icon to be displayed at the display position based on the icon resource.

[0011] Furthermore, the method for handling web page icons also includes storing icon resources in the document object model.

[0012] According to another aspect of the present invention, a webpage icon processing apparatus is also provided, comprising: a first detection module, configured to detect whether an icon set of a target webpage contains an icon identifier for an icon to be displayed; a second detection module, configured to detect whether a document object model of the target webpage contains an icon identifier if the icon set does not contain an icon identifier; a first processing module, configured to obtain icon code data of an icon to be displayed from a web server if the document object model does not contain an icon identifier, and generate an icon resource of the icon to be displayed based on the icon code data, and display the icon to be displayed on the target webpage based on the icon resource, wherein the icon code data is data in string format; and a second processing module, configured to obtain a target scalable vector graphics SVG based on the icon identifier if the icon set contains an icon identifier or the document object model contains an icon identifier, and display the icon to be displayed on the target webpage based on the target scalable vector graphics SVG.

[0013] According to another aspect of the present invention, a computer-readable storage medium is also provided, wherein a computer program is stored in the computer program, wherein the computer program is configured to execute the above-described webpage icon processing method when running.

[0014] According to another aspect of the present invention, an electronic device is also provided, the electronic device including one or more processors; a memory 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 are configured to run the programs, wherein the programs are configured to execute the above-described webpage icon processing method during runtime.

[0015] According to another aspect of the present invention, a computer program product is also provided, including a computer program / instructions, characterized in that the computer program / instructions, when executed by a processor, implement the above-described method for processing web page icons.

[0016] In this embodiment of the invention, an icon resource is acquired through both local and remote methods to display the icon on the target webpage. First, it checks whether the icon set of the target webpage contains an icon identifier for the icon to be displayed. If the icon set does not contain an icon identifier, it checks whether the document object model (Document Object Model) of the target webpage contains an icon identifier. If the Document Object Model does not contain an icon identifier, the icon code data for the icon to be displayed is obtained from the web server. Based on the icon code data, an icon resource for the icon to be displayed is generated, and the icon is displayed on the target webpage based on the icon resource. If the icon set contains an icon identifier or the Document Object Model contains an icon identifier, a target scalable vector graphics (SVG) is acquired based on the icon identifier, and the icon is displayed on the target webpage based on the target scalable vector graphics (SVG). The icon code data is in string format.

[0017] In the above process, by detecting whether the icon set and document object model contain the icon identifier of the icon to be displayed, if the icon set or document object model contains the icon identifier, the corresponding target scalable vector graphics SVG can be obtained through the icon identifier. This allows the icon to be displayed on the target webpage based on the target scalable vector graphics SVG, realizing the local acquisition of icon resources and their display on the target webpage. Furthermore, by obtaining the icon code data of the icon to be displayed from the web server and generating the icon resource based on the icon code data, the conversion of string-formatted data into the icon resource of the icon to be displayed is realized. This enables the remote acquisition of icon resources and their display on the target webpage, greatly facilitating user customization of icons and effectively meeting users' needs for customizing webpage icons, thereby improving the user experience.

[0018] Therefore, the technical solution of this invention achieves the goal of displaying the icon to be displayed on the target webpage through both local and remote methods, thereby improving the technical effect of user experience. It also solves the technical problem in the prior art that the string format icon resources cannot be converted into scalable vector graphics SVG format icon resources, which prevents users from customizing and changing the webpage icons, thus affecting the user experience. Attached Figure Description

[0019] The accompanying drawings, which are included to provide a further understanding of the invention and form part of this application, illustrate exemplary embodiments of the invention and, together with their description, serve to explain the invention and do not constitute an undue limitation thereof. In the drawings:

[0020] Figure 1 This is a flowchart of an optional webpage icon processing method according to an embodiment of the present invention;

[0021] Figure 2 This is a flowchart illustrating an optional method for displaying icons on a webpage according to an embodiment of the present invention;

[0022] Figure 3 This is a flowchart of an optional method for constructing icon resources according to an embodiment of the present invention;

[0023] Figure 4 This is a schematic diagram of an optional webpage icon processing device according to an embodiment of the present invention. Detailed Implementation

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

[0025] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this invention 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 so that the embodiments of the invention described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover a 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 all relevant information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for display, data used for analysis, etc.) involved in this invention are information and data authorized by the user or fully authorized by all parties. For example, this system has an interface with the relevant user or organization. Before obtaining relevant information, it needs to send an acquisition request to the aforementioned user or organization through the interface, and obtain the relevant information after receiving consent from the aforementioned user or organization.

[0027] Example 1

[0028] According to an embodiment of the present invention, a method embodiment for processing web page icons is provided. 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.

[0029] Figure 1 This is a flowchart of an optional webpage icon processing method according to an embodiment of the present invention, such as... Figure 1 As shown, the method includes the following steps:

[0030] Step S101: Detect whether the icon set of the target webpage contains the icon identifier of the icon to be displayed.

[0031] In the above steps, the icon set of the target webpage can be detected by devices such as application systems, processors, and electronic devices to determine whether it contains the icon identifier of the icon to be displayed. Optionally, the target webpage can be a webpage that the user wants to open through a browser, and the icon to be displayed can be an icon contained in the target webpage. Optionally, which icons are contained in the target webpage can be predetermined by a program script. For example, to display icon A and icon B on the webpage, the icon identifiers corresponding to icon A and icon B can be written into the icon display component section of the program script, thereby achieving unique identification of the icons.

[0032] Optionally, the icon identifier can be an icon resource ID, for example, icon A has an icon resource ID of 1, and icon B has an icon resource ID of 2. Alternatively, the icon set can be a CSS sprite, also known as a CSS sprite image, a web page image processing method that can include scattered images on a page into a large image for loading, improving the loading speed of web page icons. Based on the icon resource ID, the corresponding icon can be found from the sprite and displayed on the web page.

[0033] Step S102: If the icon set does not contain an icon identifier, then check whether the document object model of the target webpage contains an icon identifier.

[0034] In the steps described above, the Document Object Model (DOM) can be another form of markup language such as HTML that exists in memory and is generated by the browser. It is a tree-based API document, treating the document as a tree structure that allows code to read, process, and modify the HTML document. For ease of understanding, it can be viewed as a database that stores icon resources.

[0035] Optionally, if no icon is detected in the icon set (i.e., the sprite sheet), check whether the DOM of the current webpage (i.e., the target webpage) contains the icon.

[0036] Step S103: If the document object model does not contain an icon identifier, obtain the icon code data of the icon to be displayed from the web server, generate the icon resource of the icon to be displayed based on the icon code data, and display the icon to be displayed on the target webpage based on the icon resource. The icon code data is in string format.

[0037] In the steps described above, the icon code data can be Base64 string data. Base64 is one of the most common encoding methods used on the internet for transmitting 8-bit byte code; it's a method of representing binary data based on 64 printable characters. Optionally, the icon resource to be displayed can be a pre-built SVG DOM icon resource.

[0038] It should be noted that in the above process, the string format data was converted into icon resources to be displayed, that is, the icon resources were obtained remotely and displayed on the target webpage, which greatly facilitated the user's customization of the icons.

[0039] Step S104: If the icon set contains an icon identifier or the document object model contains an icon identifier, then obtain the target scalable vector graphics SVG based on the icon identifier, and display the icon to be displayed on the target webpage based on the target scalable vector graphics SVG.

[0040] In the above steps, the target Scalable Vector Graphic (SVG) can be an SVG format image corresponding to an icon identifier. If the icon identifier is contained in the icon set (sprite sheet) or the Document Object Model (DOM), the corresponding SVG format image is obtained based on the icon identifier, and the icon to be displayed is then displayed on the target webpage based on that image. For example, if icon A has an icon resource ID of 1 and icon B has an icon resource ID of 2, and icon resource ID1 and icon resource ID2 are detected in the sprite sheet or DOM, the corresponding SVG format images for icon resource ID1 and icon resource ID2 are obtained, and icons A and B can then be displayed on the target webpage.

[0041] It should be noted that in this embodiment of the invention, two forms of icon display are supported: either directly obtaining SVG images from the local machine, or remotely obtaining Base64 string data and processing the Base64 string data into an SVG DOM.

[0042] Based on the scheme defined in steps S101 to S104 above, it can be understood that in this embodiment of the invention, the method of displaying the icon to be displayed on the target webpage by obtaining icon resources through both local and remote methods is adopted. First, it is detected whether the icon set of the target webpage contains the icon identifier of the icon to be displayed. If the icon set does not contain the icon identifier, it is detected whether the document object model of the target webpage contains the icon identifier. If the document object model does not contain the icon identifier, the icon code data of the icon to be displayed is obtained from the network server, and based on the icon code data, the icon resource of the icon to be displayed is generated. The icon to be displayed is then displayed on the target webpage based on the icon resource. If the icon set contains the icon identifier or the document object model contains the icon identifier, the target scalable vector graphics SVG is obtained according to the icon identifier, and the icon to be displayed is then displayed on the target webpage based on the target scalable vector graphics SVG. The icon code data is in string format.

[0043] It is noteworthy that in the above process, by detecting whether the icon set and document object model contain the icon identifier of the icon to be displayed, if the icon set or document object model contains the icon identifier, the corresponding target scalable vector graphics SVG can be obtained through the icon identifier. This allows the icon to be displayed on the target webpage based on the target scalable vector graphics SVG, achieving local acquisition of icon resources and display of the icon on the target webpage. Furthermore, by obtaining the icon code data of the icon to be displayed from the web server and generating the icon resource based on the icon code data, the conversion of string-formatted data into the icon resource of the icon to be displayed is achieved. This enables remote acquisition of icon resources and display of the icon on the target webpage, greatly facilitating user customization of icons and effectively meeting users' needs for customizing webpage icons, thereby improving the user experience.

[0044] Therefore, the technical solution of this invention achieves the goal of displaying the icon to be displayed on the target webpage through both local and remote methods, thereby improving the technical effect of user experience. It also solves the technical problem in the prior art that the string format icon resources cannot be converted into scalable vector graphics SVG format icon resources, which prevents users from customizing and changing the webpage icons, thus affecting the user experience.

[0045] In one optional embodiment, during the process of generating icon resources for displaying icons based on icon code data, a code data processor is first constructed according to a preset constructor, and then the icon code data is converted and processed based on the code data processor to obtain the icon resources.

[0046] Optionally, the default constructor can be the function DOMParser(), and the code data processor can be an object instance, i.e., a parser, created by the function DOMParser(). Based on this parser, the icon code data, i.e., the Base64 string data, can be converted and processed to obtain the icon resource.

[0047] Specifically, in one optional embodiment, in the process of converting icon code data based on a code data processor to obtain icon resources, the target data in the icon code data is first removed to obtain target source code data. Then, based on the code data processor, the target source code data is converted to obtain the document object of a scalable vector graphics SVG file. Finally, the attribute information of the document object of the SVG file is processed to obtain the icon resources.

[0048] Optionally, the target data can be icon code data, i.e., a prefix in the Base64 string data. For example, the Base64 string data is: data:image / png; base64 represents a PNG image resource, where the target data can be data:image / png. Optionally, the target source code data can be data with the Base64 string prefix removed, and the document object of a Scalable Vector Graphics (SVG) file can be an SVG DOM object.

[0049] Specifically, first, removing the prefix from the Base64 string data yields the target source code data. Then, using a code data processor (parser), the target source code data undergoes format conversion to obtain an SVG DOM object. Further processing of the SVG DOM object's attributes yields the icon resources. The format conversion of the target source code data can be achieved by calling the parser's `parseFromString()` method, which parses the data (after removing the Base64 string prefix) into a DOM object. Further processing of the DOM object yields the icon resources—the constructed SVG DOM icon resources.

[0050] It should be noted that the DOM object includes other DOM objects besides the SVG DOM object. In this embodiment of the invention, only the SVG DOM object is selected for use.

[0051] Optionally, the attribute information of the SVG file's document object, i.e., the SVG DOM object, can be style, color, etc.

[0052] Specifically, in one optional embodiment, during the process of processing the attribute information of the document object of the SVG file to obtain the icon resource, the style and color of the document object of the SVG file are removed to obtain the icon resource.

[0053] Optionally, processing the attribute information of the SVG DOM object, i.e. deleting the style and color of the SVG DOM object, can yield a constructed SVG DOM icon resource. This allows icon users (e.g., users with customization needs) to modify the icon style and color by reassigning the style and color of the SVG DOM object.

[0054] In one optional embodiment, after processing the attribute information of the document object of the SVG file to obtain the icon resource, the location information of the reserved position for the icon to be displayed on the target webpage is obtained. Then, based on the location information, the display position of the icon to be displayed on the target webpage is determined. Finally, based on the icon resource, the icon to be displayed is displayed at the display position.

[0055] Optionally, the display location can be placeholder HTML, which is a reserved space on the webpage that will be replaced by the constructed SVG icon. The location information can be the information corresponding to the placeholder HTML.

[0056] Specifically, after converting the Base64 string data into a constructed SVG DOM icon resource in the above process, the placeholder HTML is replaced with the constructed SVG DOM icon resource to display the icon to be shown.

[0057] In one alternative embodiment, after processing the attribute information of the document object of the SVG file to obtain the icon resource, the icon resource is stored in the document object model.

[0058] Optionally, the icon resources, i.e., the pre-built SVG DOM icon resources, can be stored in the Document Object Model (DOM). This allows users to retrieve the icon resources directly from the DOM the next time they want to use them, without having to go through the conversion process of converting Base64 string data into pre-built SVG DOM icon resources again. This can improve the display efficiency of icons and thus enhance the user experience.

[0059] Optional, Figure 2 This is a flowchart illustrating an optional method for displaying icons on a webpage according to an embodiment of the present invention, such as... Figure 2 As shown, it mainly includes three steps:

[0060] The first step is to determine whether the page has sprite icon resources, that is, to check whether the sprite contains the required icon resources. If it does, no processing is done, and the icon resources are rendered using the graphics rendering technology widely used in this field to display the icon. If not, proceed to the second step.

[0061] The second step is to determine whether the page has constructed icon resources. That is, to check whether the current page's DOM contains the required icon resources. If it does, the icon resources are cloned and the placeholder HTML is replaced with the icon resources. If not, proceed to the third step.

[0062] The third step is to construct icon resources, which involves building an SVG DOM using Base64 string data resources as icon resources. After appropriate data processing, the placeholder HTML is replaced.

[0063] Optional, Figure 3 This is a flowchart of an optional method for constructing icon resources according to an embodiment of the present invention, such as... Figure 3 As shown, constructing icon resources mainly includes: generating a parser, converting Base64 resources into source code, parsing the source code, processing styles and colors to obtain constructed icon resources, cloning icon resources, and pasting them into the page DOM.

[0064] Specifically, a parser is first generated using the DOMParser class in the browser program code. The parser then parses the XML or HTML source code stored in the Base64 string into a DOM object.

[0065] Furthermore, the Base64 string needs to be preprocessed to ensure that the processed Base64 string meets the parsing requirements of the parser. Specifically, the prefix of the Base64 string is removed to obtain the source code string.

[0066] Furthermore, the parser's `parseFromString` method is called to parse the source code string into a DOM object, and then extracts the necessary SVG DOM resources from the DOM object. The parsed SVG DOM resources include styles and colors.

[0067] Furthermore, the styles and colors of the SVG DOM resources are removed so that icon users can re-style and color them accordingly.

[0068] Furthermore, the placeholder HTML is replaced with the SVG DOM resource after removing styles and colors, and the SVG DOM resource is cloned and then pasted into the DOM of the current page for storage.

[0069] Therefore, the technical solution of this invention achieves the goal of displaying the icon to be displayed on the target webpage through both local and remote methods, thereby improving the technical effect of user experience. It also solves the technical problem in the prior art that the string format icon resources cannot be converted into scalable vector graphics SVG format icon resources, which prevents users from customizing and changing the webpage icons, thus affecting the user experience.

[0070] Example 2

[0071] According to an embodiment of the present invention, an embodiment of a webpage icon processing apparatus is provided, wherein, Figure 4 This is a schematic diagram of an optional webpage icon processing device according to an embodiment of the present invention, such as... Figure 4As shown, the device includes: a first detection module 401, used to detect whether the icon set of the target webpage contains an icon identifier for the icon to be displayed; a second detection module 402, used to detect whether the document object model of the target webpage contains an icon identifier if the icon set does not contain an icon identifier; a first processing module 403, used to obtain icon code data of the icon to be displayed from a web server if the document object model does not contain an icon identifier, and generate an icon resource of the icon to be displayed based on the icon code data, and display the icon to be displayed on the target webpage based on the icon resource, wherein the icon code data is data in string format; and a second processing module 404, used to obtain a target scalable vector graphics SVG based on the icon identifier if the icon set contains an icon identifier or the document object model contains an icon identifier, and display the icon to be displayed on the target webpage based on the target scalable vector graphics SVG.

[0072] It should be noted that the first detection module 401, the second detection module 402, the first processing module 403 and the second processing module 404 mentioned above correspond to steps S101 to S104 in the above embodiments. The four modules and the corresponding steps implement the same examples and application scenarios, but are not limited to the content disclosed in the above embodiment 1.

[0073] Optionally, the first processing module includes: a construction module for constructing a code data processor according to a preset constructor; and a third processing module for converting the icon code data based on the code data processor to obtain icon resources.

[0074] Optionally, the third processing module includes: a fourth processing module for removing target data from the icon code data to obtain target source code data; a fifth processing module for performing format conversion processing on the target source code data based on the code data processor to obtain the document object of the Scalable Vector Graphics (SVG) file; and a sixth processing module for processing the attribute information of the document object of the SVG file to obtain icon resources.

[0075] Optionally, the sixth processing module includes a seventh processing module, which is used to remove styles and colors from the document object of the SVG file to obtain icon resources.

[0076] Optionally, the webpage icon processing device further includes: an acquisition module for acquiring location information of a reserved position for the icon to be displayed on the target webpage; a determination module for determining the display position of the icon to be displayed on the target webpage based on the location information; and a display module for displaying the icon to be displayed at the display position based on the icon resource.

[0077] Optionally, the webpage icon processing device also includes a storage module for storing icon resources in the document object model.

[0078] Example 3

[0079] According to another aspect of the present invention, a computer-readable storage medium is also provided, wherein a computer program is stored in the computer-readable storage medium, and the computer program is configured to execute the above-described webpage icon processing method when it is run.

[0080] Example 4

[0081] According to another aspect of the present invention, an electronic device is also provided, the electronic device including one or more processors; a memory 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 are configured to run the programs, wherein the programs are configured to execute the above-described webpage icon processing method during runtime.

[0082] Example 5

[0083] According to another aspect of the present invention, a computer program product is also provided, including a computer program / instructions, characterized in that the computer program / instructions, when executed by a processor, implement the above-described method for processing web page icons.

[0084] The sequence numbers of the above embodiments of the present invention are for descriptive purposes only and do not represent the superiority or inferiority of the embodiments.

[0085] In the above embodiments of the present invention, the descriptions of each embodiment have different focuses. For parts not described in detail in a certain embodiment, please refer to the relevant descriptions of other embodiments.

[0086] In the several embodiments provided in this application, it should be understood that the disclosed technical content can be implemented in other ways. The device embodiments described above are merely illustrative; for example, the division of units can be a logical functional division, and in actual implementation, there may be other division methods. For instance, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the displayed or discussed mutual coupling, direct coupling, or communication connection may be through some interfaces; the indirect coupling or communication connection between units or modules may be electrical or other forms.

[0087] The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.

[0088] Furthermore, the functional units in the various embodiments of the present invention can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.

[0089] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of the present invention. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, read-only memory (ROM), random access memory (RAM), portable hard drives, magnetic disks, or optical disks.

[0090] The above description is only a preferred embodiment of the present invention. It should be noted that for those skilled in the art, several improvements and modifications can be made without departing from the principle of the present invention, and these improvements and modifications should also be considered within the scope of protection of the present invention.

Claims

1. A method for processing webpage icons, characterized in that, include: Check whether the icon set of the target webpage contains the icon identifier of the icon to be displayed; If the icon set does not contain the icon identifier, then it is detected whether the document object model of the target webpage contains the icon identifier; If the document object model does not contain the icon identifier, then the icon code data of the icon to be displayed is obtained from the web server, and based on the icon code data, the icon resource of the icon to be displayed is generated, and the icon to be displayed is displayed on the target webpage based on the icon resource, wherein the icon code data is data in string format; If the icon set contains the icon identifier or the document object model contains the icon identifier, then based on the icon identifier, the target scalable vector graphics SVG is obtained, and based on the target scalable vector graphics SVG, the icon to be displayed is displayed on the target webpage; The process of generating the icon resource for the icon to be displayed based on the icon code data includes: Construct a code data processor based on a preset constructor; Based on the code data processor, the icon code data is converted to obtain the icon resource.

2. The method according to claim 1, characterized in that, Based on the code data processor, the icon code data is transformed to obtain the icon resource, including: The target data is removed from the icon code data to obtain the target source code data; Based on the code data processor, the target source code data is converted to obtain a document object of a scalable vector graphics SVG file. The attribute information of the document object in the SVG file is processed to obtain the icon resource.

3. The method according to claim 2, characterized in that, The icon resource is obtained by processing the attribute information of the document object of the SVG file, including: The icon resource is obtained by removing the styles and colors from the document object of the SVG file.

4. The method according to claim 2, characterized in that, After processing the attribute information of the document object of the SVG file to obtain the icon resource, the method further includes: Obtain the location information of the reserved space for the icon to be displayed on the target webpage; Based on the location information, the display position of the icon to be displayed on the target webpage is determined; Based on the icon resource, the icon to be displayed is shown at the display location.

5. The method according to claim 2, characterized in that, After processing the attribute information of the document object of the SVG file to obtain the icon resource, the method further includes: The icon resources are stored in the document object model.

6. A device for processing webpage icons, characterized in that, include: The first detection module is used to detect whether the icon set of the target webpage contains the icon identifier of the icon to be displayed; The second detection module is used to detect whether the document object model of the target webpage contains the icon identifier if the icon set does not contain the icon identifier. The first processing module is configured to, if the document object model does not contain the icon identifier, obtain the icon code data of the icon to be displayed from the web server, generate the icon resource of the icon to be displayed based on the icon code data, and display the icon to be displayed on the target webpage based on the icon resource, wherein the icon code data is data in string format; The second processing module is configured to, if the icon set contains the icon identifier or the document object model contains the icon identifier, obtain the target scalable vector graphics SVG based on the icon identifier, and display the icon to be displayed on the target webpage based on the target scalable vector graphics SVG; The first processing module includes: a construction module for constructing a code data processor according to a preset constructor; and a third processing module for converting icon code data based on the code data processor to obtain icon resources.

7. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program, wherein the computer program is configured to execute the webpage icon processing method according to any one of claims 1 to 5 when it is run.

8. An electronic device, characterized in that, The electronic device includes one or more processors; A memory for storing one or more programs, which, when executed by one or more processors, cause the one or more processors to perform the program, wherein the program is configured to execute the webpage icon processing method as described in any one of claims 1 to 5.

9. A computer program product comprising a computer program / instructions, characterized in that, When the computer program / instruction is executed by the processor, it implements the webpage icon processing method according to any one of claims 1 to 5.

Citation Information

Patent Citations

  • Webpage icon uploading method and device

    CN104899319A

  • Webpage icon loading method and device, computer storage medium and electronic equipment

    CN115270024A