Page style generation method and device and electronic equipment

Abstract

Embodiments of the invention disclose a page style generation method and apparatus, and an electronic device. The method comprises the steps of splitting a static page style attribute corresponding to a target page style into a plurality of static page style sub-attributes; according to the target page style, static attribute values corresponding to the static page style sub-attributes are determined, and the static page style sub-attributes are combined into different page style categories to be written into a hypertext markup language file; wherein the static attribute value of the static page style sub-attribute in each page style category supports independent modification; analyzing the hypertext markup language file to generate a page style file; and loading the page style file to generate a target page style. By utilizing the technical scheme provided by the specification, the modification of the page style can be realized by only modifying the attribute value of the fine-grained page style without additionally and independently writing a css file, so that the flexible generation and modification of the page style are realized.

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to a page style generation method, device and electronic device. Background Art

[0002] With the development of computer technology, page styles are becoming more and more abundant. Generally, CSS (Cascading Style Sheets) can be used to describe web page styles. It can control the styles of text, fonts, colors, layouts, backgrounds, etc. in web pages, making the presentation of web pages more beautiful, readable and easy to use.

[0003] However, in the prior art, a large number of commonly used CSS style attributes are usually preset for direct use by users. Although this method is convenient, all of its styles can only be used as a whole. If you want to change the content of one of the styles, such as changing the background color to red, you can only write another new class name to cover its style, that is, you need to write a new CSS file, which is complicated to operate, not flexible enough, and the page development cost is relatively high.

[0004] Therefore, how to provide a page style generation solution that can improve the flexibility of page style generation and modification is a technical problem that urgently needs to be solved in this field. Summary of the invention

[0005] The embodiments of this specification provide a page style generation method, apparatus, device, storage medium, and computer program product, which split static page style attributes into fine-grained parts, recombine the split static page style sub-attributes and static attribute values, and write them directly into an HTML file, support separate modification of the static attribute values ​​of static page style sub-attributes, and generate the required page style without creating additional CSS files, thereby improving the flexibility of page style generation and modification.

[0006] On the one hand, an embodiment of the present specification provides a method for generating a page style, the method comprising:

[0007] Get the corresponding static page style attributes according to the target page style;

[0008] Splitting each of the static page style attributes into a plurality of static page style sub-attributes;

[0009] According to the target page style, determine the static attribute value corresponding to the static page style sub-attribute, and combine the various static page style sub-attributes into different page style categories and write them into a hypertext markup language file; wherein each of the page style categories includes one or more static page style sub-attributes and corresponding static attribute values, and the static attribute values ​​of the static page style sub-attributes in each of the page style categories support individual modification;

[0010] Parsing the hypertext markup language file to generate a page style file;

[0011] The page style file is loaded to generate the target page style.

[0012] On the other hand, a page style generation device is provided, the device comprising:

[0013] A static attribute acquisition module is used to acquire corresponding static page style attributes according to the target page style;

[0014] A static attribute splitting module, used for splitting each of the static page style attributes into a plurality of static page style sub-attributes;

[0015] A page style writing module, used to determine the static attribute value corresponding to the static page style sub-attribute according to the target page style, and combine the various static page style sub-attributes into different page style categories and write them into a hypertext markup language file; wherein each of the page style categories includes one or more static page style sub-attributes and corresponding static attribute values, and the static attribute values ​​of the static page style sub-attributes in each of the page style categories support individual modification;

[0016] A page style parsing module, used to parse the hypertext markup language file and generate a page style file;

[0017] The page style generation module is used to load the page style file and generate the target page style.

[0018] Furthermore, the device also includes a static attribute editing module, which is used to:

[0019] Receive a static style modification request of the target page style, wherein the static style modification request includes a static page style sub-attribute to be modified and a target static attribute value;

[0020] According to the static style modification request, the static attribute value of the to-be-modified static page style sub-attribute in the hypertext markup language file is modified to the target static attribute value to generate a new target page style.

[0021] Furthermore, the device also includes a dynamic attribute editing module, which is used to:

[0022] Acquire dynamic page style attributes according to the target page style;

[0023] Writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to a preset dynamic editing method; wherein the dynamic attribute value corresponding to the dynamic page style attribute supports separate modification;

[0024] When parsing the hypertext markup language file, the page style parsing module is specifically used to:

[0025] The dynamic page style attributes and dynamic attribute values ​​in the hypertext markup language file are parsed using a preset parser to obtain dynamic page style information, and the dynamic page style information is added to the page style information; the preset parser includes the dynamic editing method.

[0026] Furthermore, the preset dynamic editing method includes adding specified symbols before and after the dynamic attribute value, and the page style parsing module is specifically used to:

[0027] The designated symbol is added before and after the dynamic attribute value corresponding to the dynamic page style attribute, and the dynamic page style attribute and the dynamic attribute value with the designated symbol added are written into the hypertext markup language file.

[0028] Furthermore, the device also includes a dynamic attribute modification module, which is used to:

[0029] receiving a dynamic style modification request of the target page style, wherein the dynamic style modification request includes a dynamic page style attribute to be modified and a target dynamic attribute value;

[0030] According to the dynamic style modification request, the dynamic attribute value in the designated symbol corresponding to the dynamic page style attribute to be modified in the hypertext markup language file is modified to a target dynamic attribute value to generate a new target page style.

[0031] Furthermore, the page style parsing module is specifically used for:

[0032] Parsing the hypertext markup language file to obtain static page style data and dynamic page style data in the hypertext markup language;

[0033] Obtaining the static page style sub-attribute and the static attribute value in each of the page style categories in the static page style data;

[0034] Acquire dynamic page style attributes and dynamic attribute values ​​in the dynamic page style data;

[0035] The static page style sub-attributes and static attribute values, the dynamic page style attributes and dynamic attribute values ​​in each of the page style categories are deduplicated to obtain the page style file.

[0036] Another aspect provides an electronic device, including: a processor;

[0037] a memory for storing instructions executable by the processor;

[0038] The processor is configured to execute the instructions to implement any of the above-mentioned page style generation methods.

[0039] On the other hand, a computer-readable storage medium is provided. When instructions in the storage medium are executed by a processor of an electronic device, the electronic device can execute any of the above-mentioned page style generation methods.

[0040] On the other hand, a computer program product or a computer program is provided, the computer program product or the computer program includes computer instructions, the computer instructions are stored in a computer-readable storage medium. The processor of the computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device executes the page style generation method provided in the above various optional implementations.

[0041] The page style generation method, apparatus, device, storage medium, and computer program product provided in the embodiments of this specification have the following technical effects:

[0042] The page style generation method provided in the embodiment of this specification obtains static page style attributes according to the target page style, and then splits the static page style attributes into multiple fine-grained static page style sub-attributes, and determines the static attribute values ​​corresponding to each of the multiple static page style sub-attributes according to the target page style. Then, multiple static page style sub-attributes and their static attribute values ​​are combined into different page style categories and written into an HTML file, and then the HTML file is parsed to obtain the written page style information, generate a page style file, and generate the target page style by loading the page style file. The embodiment of this specification splits the static page style attributes into fine-grained static page style sub-attributes and recombines them into an HTML file, and directly generates a CSS file based on the HTML file. The static attribute value of each static page style sub-attribute supports separate modification, so that the page style can be modified by only modifying the static attribute value of the static page style sub-attribute, without the need to write an additional CSS file to cover the original CSS file, thereby realizing flexible generation and modification of the page style and reducing the development cost of the page style. Moreover, in this application, all CSS attributes can be completed in HTML files. The corresponding CSS files can be generated by directly parsing HTML files. All codes only need to be written in HTML, and there is no need to create additional style files, which improves the consistency of page style development. In addition, only the page styles that have been written in HTML files are built into the final CSS file, and CSS class names that are not used in HTML will not be built into the CSS file. Packaging on demand reduces the size of the final generated CSS file, which can reduce the system memory usage. BRIEF DESCRIPTION OF THE DRAWINGS

[0043] In order to more clearly illustrate the technical solutions and advantages in the embodiments of this specification or the prior art, the drawings required for use in the embodiments or the prior art descriptions are briefly introduced below. Obviously, the drawings described below are only some embodiments of this specification. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.

[0044] Figure 1 It is a schematic diagram of an application environment of a page style generation method provided in an embodiment of this specification;

[0045] Figure 2 It is a flowchart of a page style generation method provided by an embodiment of this specification;

[0046] Figure 3 This is a schematic diagram of the principle flow of generating a page style file in one embodiment of this specification;

[0047] Figure 4It is a structural schematic diagram of a page style generating device provided in an embodiment of this specification;

[0048] Figure 5 is a schematic diagram of the structure of a page style generating device provided by another embodiment of the present specification;

[0049] Figure 6 is a block diagram of an electronic device for generating a page style provided by an embodiment of this specification;

[0050] Figure 7 This is a block diagram of another electronic device for page style generation provided in an embodiment of this specification. DETAILED DESCRIPTION

[0051] The following will be combined with the drawings in the embodiments of this specification to clearly and completely describe the technical solutions in the embodiments of this specification. Obviously, the described embodiments are only part of the embodiments of this specification, not all of the embodiments. Based on the embodiments in this specification, all other embodiments obtained by ordinary technicians in this field without making creative work are within the scope of protection of this specification.

[0052] It should be noted that the terms "first", "second", etc. in the description and claims of the embodiments of this specification and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchangeable where appropriate, so that the embodiments of this specification described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having" and any variations thereof are intended to cover non-exclusive inclusions, for example, a process, method, system, product, or server that includes a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products, or devices.

[0053] See also Figure 1 , Figure 1 1 is a schematic diagram of an application environment of a page style generation method provided in an embodiment of the present specification, and the application environment may at least include a server 100 and a terminal 200.

[0054] In an optional embodiment, server 100 can be used to generate pages including page style and page content, etc. Server 100 can be an independent physical server, or a server cluster or distributed system composed of multiple physical servers. It can also be a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN, as well as big data and artificial intelligence platforms.

[0055] In an optional embodiment, the terminal 200 may also generate a page, or send a page generation request to the server 100 to request the server 100 to generate a terminal for the page. Specifically, the terminal 200 may include but is not limited to smart phones, desktop computers, tablet computers, laptop computers, smart speakers, digital assistants, augmented reality (AR) / virtual reality (VR) devices, smart wearable devices, vehicle terminals, smart TVs and other types of electronic devices; it may also be software running on the above electronic devices, such as applications, applets, etc. The operating system running on the electronic device in the embodiments of this specification may include but is not limited to Android system, IOS system, Linux, Windows, etc.

[0056] In addition, it should be noted that Figure 1 What is shown is merely an application environment of a page style generation method, and the embodiments of this specification are not limited to the above.

[0057] In the embodiments of this specification, the server 100 and the terminal 200 may be directly or indirectly connected via wired or wireless communication, which is not limited in the embodiments of this specification.

[0058] The page style generation method provided in the embodiments of this specification can be used to generate styles in a page, such as the styles of text, fonts, colors, layouts, backgrounds, etc. in the page, which can reflect the content of the page display effect. The page style in the embodiments of this specification can be the style of a web page, or the style of a page in a terminal application or applet, or the style of other pages. The embodiments of this specification do not make specific limitations on this.

[0059] The following describes a page style generation method according to an embodiment of this specification. Figure 2 It is a flow chart of a page style generation method provided by an embodiment of this specification. This specification provides method operation steps such as the embodiment or flow chart, but may include more or fewer operation steps based on conventional or non-creative labor. The order of steps listed in the embodiment is only one way of executing the steps among many orders, and does not represent the only execution order. When the actual system or server product is executed, it can be executed in sequence or in parallel according to the method shown in the embodiment or the accompanying drawings (for example, in a parallel processor or multi-threaded processing environment). The method can be applied to terminal devices such as computers, tablet computers, and smart phones. Of course, it can also be applied to servers according to actual needs. The embodiments of this specification do not specifically limit this. Specifically, Figure 2 As shown, the method may include:

[0060] S202: Obtain corresponding static page style attributes according to the target page style.

[0061] In the specific implementation process, the target page style can be understood as the style of the page you want to build, or the page style required by the user or the style of the page to be built, such as: the user wants to build a page, the layout of the page is A, the background is B, the color is C, the font is D, etc., then the page style required by the user can be used as the target page style. Among them, the page style can be understood as the characteristics that can reflect the page display effect, such as: text, font, color, layout, background, etc., referring to the records of the above embodiments, the specific content of the page style can be set according to actual needs, and the embodiments of this specification do not make specific limitations. After determining the target page style, the corresponding static page style attributes can be obtained according to the target page style, wherein the static page style attributes can be understood as the page element style attributes in the page style that will not change with the change of the numerical value, such as: color, background, font style, etc., which can be mainly understood as the page element style that does not involve specific numerical values. The static page style attributes in the embodiments of this specification can be understood as static CSS attributes or CSS class names, etc. After obtaining the target page style, the corresponding CSS attributes can be obtained according to the style types involved in the target page style. For example, if the target page style involves layout, background, font, and color, then the static CSS attributes related to the layout, background, font, and color can be obtained from the CSS attributes as static page style attributes.

[0062] S204: Split each static page style attribute into a plurality of static page style sub-attributes.

[0063] In the specific implementation process, the target page style generally involves multiple CSS attributes. In the embodiments of this specification, the static CSS attributes are finely split, and each static page style attribute can be split into multiple static page style sub-attributes, wherein the splitting method can be based on the CSS specification and split according to the minimum granularity. The number of static page style sub-attributes that can be split from a static page style attribute can be determined according to the minimum granularity attribute rule contained in the static page style attribute in the CSS specification, and the embodiments of this specification do not make specific limitations. For example: In some embodiments, there is a CSS attribute or CSS class named btn-primary, and btn-primary contains color-white (font color - white); background-color-red (background color - white); font-normal (font - default). When the target page style involves fonts and backgrounds, btn-primary can be obtained as a static page style attribute, and then btn-primary can be split into three static page style sub-attributes, namely color, background-color and font.

[0064] S206: Determine the static attribute value corresponding to the static page style sub-attribute according to the target page style, and combine the various static page style sub-attributes into different page style categories and write them into a hypertext markup language file; wherein each page style category includes one or more static page style sub-attributes and corresponding static attribute values, and the static attribute values ​​of the static page style sub-attributes in each page style category support separate modification.

[0065] In a specific implementation process, after the target page style is determined, the static attribute values ​​corresponding to each static page style sub-attribute can be determined according to the target page style, and the static attribute value is the value of the static page style sub-attribute. For example: in the above embodiment, color-white, white is the static attribute value corresponding to the static page style sub-attribute color. If the font color in the target page style is white, then the static attribute value of color can be set to white. After the static attribute value of each static page style sub-attribute is determined, different static page style sub-attributes can be arbitrarily combined to obtain different page style categories. Each page style category can include one or more static page style sub-attributes and their corresponding static attribute values, and each page style category is written into a hypertext markup language file, that is, after the static page style attribute is split into multiple static page style sub-attributes, multiple static page style sub-attributes and their corresponding static attribute values ​​are combined to obtain different page style categories and write them into the html file. In the embodiment of this specification, the static attribute value of the static page style sub-attribute in each page style category supports separate modification. For example: if the user wants to change the font color in the page style category corresponding to the font in the target page style to red, color-white can be changed to color-red alone.

[0066] When the static page style sub-attributes and their corresponding static attribute values ​​are combined, the static page style sub-attributes and their static attribute values ​​split from different static page style attributes can be combined together according to actual needs to obtain different page style categories and write them into the HTML file. For example, the static page style sub-attribute A1 and its static attribute value split from the static page style attribute A can be combined with the static page style sub-attribute B1 and its static attribute value split from the static page style attribute B to form a page style category and write it into the HTML file. When the static page style sub-attributes are combined, they can be combined according to whether the page elements represented by each static page style sub-attribute are related, such as: the static page style sub-attributes and their static attribute values ​​related to the same page element (such as font) can be combined into a page style category. The static page style sub-attributes and their static attribute values ​​split from the same static page style attribute can also be combined into a page style category. The number of static page style sub-attributes in each page style category can be determined according to the actual scenario, and the combination method of the static page style sub-attributes can be determined according to actual needs, and the embodiments of this specification do not make specific limitations.

[0067] A page style category can generally represent a relatively complete page style, such as: the layout of the entire page (including layout style, layout position, etc.), the font in the page (including font style, color, size, etc.), while static page style sub-attributes generally represent the style of elements in the page. A single static page style sub-attribute generally cannot represent a complete page style. By combining multiple static page style sub-attributes into a page style category, the content of the page style can be expressed more completely and clearly. Generating page styles based on page style categories can improve the accuracy and efficiency of page style generation.

[0068] In the embodiments of this specification, the CSS attributes are split into finer granularity and finally combined into a complete larger attribute. In this way, some commonly used large and comprehensive styles can be split into small and assemblable styles, and the fine-grained page styles can be modified separately.

[0069] For example, if the target page style wants to achieve horizontal and vertical centering of a button, you can <button class＝”flex align-items-center justify-content-center”>As a page style category written into the HTML file, flex means the layout is flex, align-items-center means vertical centering, and justify-content-center means horizontal centering. The layout-related properties are divided into three css class names: flex, align-items-center, and justify-content-center. So when we want it to be arranged horizontally, we only need to replace justify-content-center with justify-content-start.

[0070] Generally, when you need to modify the page style, you need to rewrite the css file to overwrite the original css file. For example, the btn-primary in the above embodiment corresponds to a whole, that is, a button. This button contains color-white, background-color-red, and font-normal. If you want to change the font color to red, you need to rewrite a css file. The css file contains color-red, background-color-red, and font-normal. The new css file must be used to overwrite the original css file to modify the page style. The embodiment of this specification uses the method of splitting and combining css attributes. When a page style is needed, you only need to directly modify the attribute value of a sub-attribute, without creating additional css files to write some custom styles to overwrite some default style behaviors.

[0071] S208: Parse the hypertext markup language file to generate a page style file.

[0072] In the specific implementation process, all style declarations in the embodiments of this specification can be completed in HTML, that is, the static page style sub-attributes and static attribute values ​​required by the target page style are directly written in the HTML file. Then the HTML file is parsed, the information about the page style written therein is extracted, converted into a string array, and a page style file is generated. Among them, the page style file is generally a CSS file, which contains page style information such as the layout style, background color, font color, etc. in the above embodiments. The HTML file can also include information related to the page content, such as: text, graphics, animation, sound, table, link, etc.

[0073] S210: Load a page style file to generate a target page style.

[0074] In the specific implementation process, after parsing the HTML file to obtain the page style file, namely the CSS file, the CSS file is loaded, and data processing such as page style rendering is performed based on the page style information in the CSS file, that is, the target page style can be generated, and the HTML file can also be loaded to generate page content, thereby generating a page.

[0075] The embodiment of the present specification provides a page style generation method, which obtains static page style attributes according to the target page style, and then splits the static page style attributes into multiple fine-grained static page style sub-attributes, and determines the static attribute values ​​corresponding to each of the multiple static page style sub-attributes according to the target page style. Then, the multiple static page style sub-attributes and their static attribute values ​​are written into an HTML file as a page style category, and then the HTML file is parsed to obtain the written page style information, generate a page style file, and generate the target page style by loading the page style file. The embodiment of the present specification splits the static page style attributes into fine-grained static page style sub-attributes and recombines them into the HTML file, and directly generates a CSS file based on the HTML file. The static attribute value of each static page style sub-attribute supports separate modification, so that the page style can be modified by only modifying the static attribute value of the static page style sub-attribute, without the need to write an additional CSS file to cover the original CSS file, thereby realizing flexible generation and modification of the page style and reducing the development cost of the page style. Moreover, in the present application, the css attributes can all be completed in the html file, and the corresponding css file can be generated by directly parsing the html file. All codes only need to be written in html, and there is no need to create additional style files, which improves the consistency of page style development. In addition, when generating a page style file, the embodiment of this specification only builds the page style that has been written in the html file into the final css file, and the css class names that are not used in the html will not be built into the css file. It is packaged on demand, which reduces the size of the final generated css file, and can further reduce the system memory usage.

[0076] In some embodiments of this specification, the method further includes:

[0077] Receive a static style modification request for a target page style, wherein the static style modification request includes a static page style sub-attribute to be modified and a target static attribute value;

[0078] According to the static style modification request, the static attribute value of the to-be-modified static page style sub-attribute in the hypertext markup language file is modified to a target static attribute value to generate a new target page style.

[0079] In the specific implementation process, when it is necessary to modify some or a certain static page style sub-attribute in the target page style, a static style modification request can be determined according to the modification requirements. The static style modification request can carry the static page style sub-attribute to be modified and the target static attribute value, and then the static attribute value of the static page style sub-attribute to be modified in the html file can be modified to the target static attribute value based on the static style modification request. For example: replace justify-content-center in the above embodiment with justify-content-start, so that after parsing the html file, a new page style file, i.e., a new css file, can be automatically generated. By loading the new css file, a new target page style can be generated. The new target page style can change the horizontal center to the horizontal forward arrangement, thereby realizing flexible modification of the target page style.

[0080] The embodiments of this specification perform fine-grained splitting of static page style attributes. The static attribute values ​​of the split static page style sub-attributes support individual modification. In this way, the page style can be modified by only modifying the static attribute values ​​of the static page style sub-attributes. Finer-grained CSS class names are used to assemble arbitrary styles, eliminating the need to write additional custom class names to override default rules, thereby improving the flexibility of page style generation and modification.

[0081] In some embodiments of this specification, the method further includes:

[0082] Get dynamic page style attributes according to the target page style;

[0083] Writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to a preset dynamic editing method; wherein the dynamic attribute value corresponding to the dynamic page style attribute supports separate modification;

[0084] When parsing the hypertext markup language file, the method further includes:

[0085] The dynamic page style attributes and dynamic attribute values ​​in the hypertext markup language file are parsed using a preset parser to obtain dynamic page style information, and the dynamic page style information is added to the page style information; the preset parser includes a dynamic editing mode.

[0086] In the specific implementation process, there are some attributes in the page style that involve numerical values, and these attributes will change the page style as the numerical values ​​change. In the embodiments of this specification, the page style attributes that involve numerical value changes can be called dynamic page style attributes. Of course, some static page style attributes and dynamic page style attributes may have repeated parts. The embodiments of this specification do not specifically limit the types and divisions of static page style attributes and dynamic page style attributes. For example: In the above embodiment, font-normal means that the font is set to the default format. The default format usually represents a font size of 14px. So if you want to change the font size to other values, since the font size may have a lot of values, it is impossible to preset a style name for all values. Not only can it not be implemented, but it will also cause the size of the style to expand rapidly and affect the size of the final constructed CSS file.

[0087] The embodiments of this specification pre-design a dynamic editing method for this dynamic page style attribute, and write the dynamic page style attribute and its dynamic attribute value into the HTML file according to the preset dynamic editing method. Among them, the dynamic editing method can be understood as a code writing method for the dynamic page style attribute, and any attribute written in this way can be understood as a dynamic page style attribute, for example: setting the dynamic editing method to: adding a specified character to the dynamic attribute value of the dynamic page style attribute, then as long as the dynamic attribute value contains the specified character, it can be considered to belong to the dynamic page style attribute. The dynamic attribute value corresponding to the dynamic page style attribute can support separate modification, for example: if you want to change the font size to 17px, just change the dynamic attribute value corresponding to font in the HTML file to 17px. At the same time, a preset parser is designed for the preset dynamic editing method, which includes the dynamic editing method, that is, the definition method of the dynamic editing method. The preset parser can parse the dynamic page style attribute and its dynamic attribute value based on the dynamic editing method. When parsing an HTML file, a preset parser can be used to parse the dynamic page style attributes and their attribute values ​​in the HTML file. For example, the dynamic editing mode is set to add a specified character to the dynamic attribute value of the dynamic page style attribute. If the attribute value of a certain page style attribute in the HTML file is identified to contain the specified character, the page style attribute can be considered as a dynamic page style attribute. The dynamic page style attributes and their dynamic attribute values ​​in the HTML file can be added to the page style information as dynamic page style information, and then the target page style can be generated based on the page style information.

[0088] There is no specific requirement for the order of writing dynamic page style attributes and static page style attributes, which can be set according to actual needs and are not specifically limited in the embodiments of this specification.

[0089] The embodiments of this specification design a dynamic editing method for dynamic page style attributes, write the dynamic page style attributes into the HTML file according to the dynamic editing method, support dynamic CSS declaration capabilities, and directly use a dynamic editing method to cover almost all development scenarios for dynamic page styles that need to adjust values, without the need to design a CSS file for each value, thereby improving the flexibility of page style generation. In addition, dynamic attribute values ​​can be modified individually, which improves the flexibility of page style modification.

[0090] In some embodiments of the present specification, the preset dynamic editing method includes adding specified symbols before and after the dynamic attribute value, and writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to the preset dynamic editing method, including:

[0091] The specified symbols are added before and after the dynamic attribute value corresponding to the dynamic page style attribute, and the dynamic page style attribute and the dynamic attribute value with the specified symbols added are written into a hypertext markup language file.

[0092] In the specific implementation process, in some embodiments of this specification, the dynamic editing method is set to set specified symbols before and after the dynamic attribute value, that is, to wrap the dynamic attribute value with the specified symbols, wherein the specified symbols can be set according to actual needs, such as: can be parentheses or brackets or other symbols, which are not specifically limited in the embodiments of this specification. Adding specified symbols before and after the dynamic attribute value can be understood as setting the dynamic attribute value between the specified symbols. For example, the dynamic attribute value can be wrapped in parentheses. After setting the dynamic editing method, you can add specified symbols before and after the dynamic attribute value, and write the dynamic page style attributes and the dynamic attribute values ​​with the specified symbols added into the html file. For example: In a scenario instance, you can write in the html file:<text class=”font-(14px)”> When the font attribute is parsed, it is known that it represents a font attribute. When the parentheses are parsed, it is known that this is a dynamic attribute. (14px) is parsed as a value of 14px, and they are combined into a CSS rule of font-size:14px. This rule will be added to the final CSS file to be applied to the corresponding page style elements. In this way, dynamic capabilities are realized, and there is no need to create additional CSS files to write styles. All page expression capabilities can be completed in HTML.

[0093] In some embodiments of this specification, the method further includes:

[0094] Receive a dynamic style modification request for a target page style, where the dynamic style modification request includes a dynamic page style attribute to be modified and a target dynamic attribute value;

[0095] According to the dynamic style modification request, the dynamic attribute value in the designated symbol corresponding to the dynamic page style attribute to be modified in the hypertext markup language file is modified to the target dynamic attribute value to generate a new target page style.

[0096] In the specific implementation process, when it is necessary to modify some or a certain dynamic page style sub-attribute in the target page style, a dynamic style modification request can be determined according to the modification requirements. The dynamic style modification request can carry the dynamic page style sub-attribute to be modified and the target dynamic attribute value, and then the dynamic attribute value of the dynamic page style sub-attribute to be modified in the html file can be modified to the target dynamic attribute value based on the dynamic style modification request. For example: replace "font-(14px)" in the above embodiment with "font-(17px)", so that after parsing the html file, a new page style file, i.e., a new css file, can be automatically generated. By loading the new css file, a new target page style can be generated. The new target page style can modify the font size from 14px to 17px, thereby realizing flexible modification of the target page style.

[0097] The embodiment of this specification edits the code of dynamic page style attributes involving numerical values ​​using a preset dynamic editing method. When the dynamic attribute value of the dynamic page style attribute needs to be modified, the dynamic attribute value can be directly modified in the HTML file. There is no need to write different CSS files for different numerical values, thereby improving the flexibility of page style generation and modification.

[0098] In some embodiments of this specification, a hypertext markup language file is parsed to generate a page style file, including:

[0099] Parsing the hypertext markup language file to obtain static page style data and dynamic page style data in the hypertext markup language;

[0100] Obtain the static page style sub-attributes and static attribute values ​​in each page style category in the static page style data;

[0101] Get dynamic page style attributes and dynamic attribute values ​​in dynamic page style data;

[0102] The static page style sub-attributes and static attribute values, dynamic page style attributes and dynamic attribute values ​​in each page style category are deduplicated to obtain a page style file.

[0103] In the specific implementation process, generally, a very rich set of commonly used styles are preset in the default class library before the page style is generated, but in actual use, all styles, i.e., page style attributes, are built in the css file, which will cause the css file to be very large. In the process of generating the page style, the embodiment of this specification parses the html file, collects dependencies from it, and only selects the class names written in the html to be built into the final css file, which greatly reduces the size of the css file. Figure 3 is a schematic diagram of the principle flow of generating a page style file in one embodiment of this specification, such as Figure 3 As shown, referring to the method described in the above embodiment, after writing the corresponding page style information in the html file according to the target page style, when parsing the html file, the relevant information of the target page style can be parsed from the html file, and the relevant information of the target page style can include static page style data and dynamic page style data, which are divided into static page style and dynamic page style according to the page style attributes, and then the page style information is extracted for the static page style and the dynamic page style respectively. Fine-grained splitting can be performed for the static page style, that is, the static page style sub-attributes and static attribute values ​​in each page style category are extracted, such as Figure 3 As shown, taking the horizontal and vertical centering page style category in the above embodiment as an example, the static page style sub-attributes and static attribute values ​​that can be extracted are: flex, items-center and justify-center. For dynamic page styles, a preset parser can be used to extract dynamic page style attributes and dynamic attribute values, such as Figure 3 As shown, in a scenario example, the parser identifies the specified characters, i.e., parentheses, and then obtains the dynamic page style attributes text-(17px) and color-(###). The parser then parses the attribute values ​​therein to obtain the dynamic page style attributes and dynamic attribute values ​​font-size:17px and coloe:###, where "###" can represent a color. The parsed and extracted information is converted into a string array, and the data corresponding to the static page style and the data corresponding to the dynamic page style are merged, and then deduplication is performed to obtain the final page style file, i.e., the used css class set.

[0104] Because static page style attributes and dynamic page style attributes may be repeated, such as font-normal in the static page style attributes and font-(14px) in the dynamic page style attributes actually have the same meaning, only one of them can be retained during deduplication processing.

[0105] In the embodiments of the present specification, when parsing HTML, the relevant data of the static page style and the relevant data of the dynamic page are extracted respectively, and then deduplication processing is performed, so that the generated page style file only has the CSS class name written in HTML, and there is no repeated data, thereby reducing the final CSS file, thereby reducing the memory space occupied when the page is generated, and improving the performance of the page style generation processing device.

[0106] Based on the page style generation method described above, one or more embodiments of this specification also provide a terminal and a server for page style generation processing. The terminal and the server may include a device (including a distributed system), software (application), module, component, server, terminal, etc. that uses the method described in the embodiment of this specification and is combined with a device that implements the necessary hardware. Based on the same innovative concept, the device in one or more embodiments provided in the embodiment of this specification is as described in the following embodiments. Since the implementation scheme and method of the device to solve the problem are similar, the implementation of the specific device in the embodiment of this specification can refer to the implementation of the aforementioned method, and the repetitions will not be repeated. As used below, the term "unit" or "module" can implement a combination of software and / or hardware for predetermined functions. Although the device described in the following embodiments is preferably implemented in software, the implementation of hardware, or a combination of software and hardware, is also possible and conceived.

[0107] It can be seen from the technical solutions provided in the above embodiments of this specification that the embodiments of this specification also provide a page style generating device. Figure 4 is a schematic diagram of a page style generating device provided in an embodiment of this specification. Figure 4 As shown, the above device comprises:

[0108] The static attribute acquisition module 410 is used to acquire the corresponding static page style attributes according to the target page style;

[0109] A static attribute splitting module 420, configured to split each of the static page style attributes into a plurality of static page style sub-attributes;

[0110] The page style writing module 430 is used to determine the static attribute value corresponding to the static page style sub-attribute according to the target page style, and combine the various static page style sub-attributes into different page style categories and write them into a hypertext markup language file; wherein each of the page style categories includes one or more static page style sub-attributes and corresponding static attribute values, and the static attribute values ​​of the static page style sub-attributes in each of the page style categories support individual modification;

[0111] The page style parsing module 440 is used to parse the hypertext markup language file and generate a page style file;

[0112] The page style generating module 450 is used to load the page style file and generate the target page style.

[0113] Figure 5 is a schematic diagram of the structure of a page style generating device provided by another embodiment of the present specification, such as Figure 5 As shown, the device further includes a dynamic attribute editing module 510, which is used to:

[0114] Acquire dynamic page style attributes according to the target page style;

[0115] Writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to a preset dynamic editing method; wherein the dynamic attribute value corresponding to the dynamic page style attribute supports separate modification;

[0116] When parsing the hypertext markup language file, the page style parsing module is specifically used to:

[0117] The dynamic page style attributes and dynamic attribute values ​​in the hypertext markup language file are parsed using a preset parser to obtain dynamic page style information, and the dynamic page style information is added to the page style information; the preset parser includes the dynamic editing method.

[0118] Regarding the device in the above embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment of the method, and will not be elaborated in detail here. The device in the above embodiment may also include other implementation methods according to the description of the method embodiment, and the specific implementation method can refer to the description of the relevant method embodiment, which will not be repeated here one by one.

[0119] Figure 6 is a block diagram of an electronic device for generating a page style provided by an embodiment of this specification. The electronic device may be a terminal, and its internal structure diagram may be as shown in FIG. Figure 6 As shown. The electronic device includes a processor, a memory, a network interface, a display screen and an input device connected through a system bus. Among them, the processor of the electronic device is used to provide computing and control capabilities. The memory of the electronic device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The network interface of the electronic device is used to communicate with an external terminal through a network connection. When the computer program is executed by the processor, a page style generation method is implemented. The display screen of the electronic device can be a liquid crystal display screen or an electronic ink display screen, and the input device of the electronic device can be a touch layer covering the display screen, or a key, trackball or touchpad set on the housing of the electronic device, or an external keyboard, touchpad or mouse, etc.

[0120] Figure 7 is a block diagram of another electronic device for generating a page style provided by an embodiment of this specification. The electronic device may be a server, and its internal structure diagram may be as shown in FIG. Figure 7 As shown. The electronic device includes a processor, a memory and a network interface connected through a system bus. Among them, the processor of the electronic device is used to provide computing and control capabilities. The memory of the electronic device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The network interface of the electronic device is used to communicate with an external terminal through a network connection. When the computer program is executed by the processor, a page style generation method is implemented.

[0121] Those skilled in the art will understand that Figure 6 or Figure 7 The structure shown in the figure is merely a block diagram of a portion of the structure related to the embodiment scheme of this specification, and does not constitute a limitation on the electronic device to which the embodiment scheme of this specification is applied. The specific electronic device may include more or fewer components than shown in the figure, or combine certain components, or have a different arrangement of components.

[0122] In an exemplary embodiment, an electronic device is also provided, including: a processor; a memory for storing instructions executable by the processor; wherein the processor is configured to execute the instructions to implement the page style generation method as in the embodiment of this specification.

[0123] In an exemplary embodiment, a computer-readable storage medium is also provided. When instructions in the storage medium are executed by a processor of an electronic device, the electronic device can execute the page style generating method in the embodiment of this specification.

[0124] In an exemplary embodiment, a computer program product or a computer program is also provided, the computer program product or the computer program includes computer instructions, the computer instructions are stored in a computer-readable storage medium. The processor of the computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device executes the page style generation method provided in the above various optional implementations.

[0125] It is understandable that in the specific implementation of this specification, user-related data is involved. When the above embodiments of this specification are applied to specific products or technologies, user permission or consent is required, and the collection, use and processing of relevant data must comply with relevant laws, regulations and standards of relevant countries and regions.

[0126] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiment methods can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, any reference to memory, storage, database or other media used in the embodiments provided in this specification can include non-volatile and / or volatile memory. Non-volatile memory can include read-only memory (ROM), programmable ROM (PROM), electrically programmable ROM (EPROM), electrically erasable programmable ROM (EEPROM) or flash memory. Volatile memory can include random access memory (RAM) or external cache memory. As an illustration and not limitation, RAM is available in many forms, such as static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), double data rate SDRAM (DDRSDRAM), enhanced SDRAM (ESDRAM), synchronous link (Synchlink) DRAM (SLDRAM), memory bus (Rambus) direct RAM (RDRAM), direct memory bus dynamic RAM (DRDRAM), and memory bus dynamic RAM (RDRAM).

[0127] Those skilled in the art will readily appreciate other implementations of the embodiments of the present specification after considering the specification and practicing the invention disclosed herein. The present specification is intended to cover any variations, uses, or adaptations of the embodiments of the present specification, which follow the general principles of the embodiments of the present specification and include common knowledge or customary technical means in the art that are not disclosed in the embodiments of the present specification. The description and embodiments are to be considered merely as exemplary, and the true scope and spirit of the embodiments of the present specification are indicated by the following claims.

[0128] It should be understood that the embodiments of the present specification are not limited to the precise structures described above and shown in the drawings, and various modifications and changes may be made without departing from the scope thereof. The scope of the embodiments of the present specification is limited only by the appended claims.< / button>

Claims

1. A page style generation method, characterized in that: The method comprises: Get the corresponding static page style attributes according to the target page style; Splitting each of the static page style attributes into a plurality of static page style sub-attributes; According to the target page style, determine the static attribute value corresponding to the static page style sub-attribute, and combine the various static page style sub-attributes into different page style categories and write them into a hypertext markup language file; wherein each of the page style categories includes one or more static page style sub-attributes and corresponding static attribute values, and the static attribute values ​​of the static page style sub-attributes in each of the page style categories support individual modification; Parsing the hypertext markup language file to generate a page style file; The page style file is loaded to generate the target page style.

2. The method according to claim 1, characterized in that The method further comprises: Receive a static style modification request of the target page style, wherein the static style modification request includes a static page style sub-attribute to be modified and a target static attribute value; According to the static style modification request, the static attribute value of the to-be-modified static page style sub-attribute in the hypertext markup language file is modified to the target static attribute value to generate a new target page style.

3. The method according to claim 1, characterized in that The method further comprises: Acquire dynamic page style attributes according to the target page style; Writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to a preset dynamic editing method; wherein the dynamic attribute value corresponding to the dynamic page style attribute supports separate modification; When parsing the hypertext markup language file, the method further includes: The dynamic page style attributes and dynamic attribute values ​​in the hypertext markup language file are parsed using a preset parser to obtain dynamic page style information, and the dynamic page style information is added to the page style information; the preset parser includes the dynamic editing method.

4. The method according to claim 3, characterized in that The preset dynamic editing method includes adding specified symbols before and after the dynamic attribute value, and writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to the preset dynamic editing method, including: The designated symbol is added before and after the dynamic attribute value corresponding to the dynamic page style attribute, and the dynamic page style attribute and the dynamic attribute value with the designated symbol added are written into the hypertext markup language file.

5. The method according to claim 4, characterized in that The method further comprises: receiving a dynamic style modification request of the target page style, wherein the dynamic style modification request includes a dynamic page style attribute to be modified and a target dynamic attribute value; According to the dynamic style modification request, the dynamic attribute value in the designated symbol corresponding to the dynamic page style attribute to be modified in the hypertext markup language file is modified to a target dynamic attribute value to generate a new target page style.

6. The method according to claim 3, characterized in that The step of parsing the hypertext markup language file to generate a page style file includes: Parsing the hypertext markup language file to obtain static page style data and dynamic page style data in the hypertext markup language; Obtaining the static page style sub-attribute and the static attribute value in each of the page style categories in the static page style data; Acquire dynamic page style attributes and dynamic attribute values ​​in the dynamic page style data; The static page style sub-attributes and static attribute values, the dynamic page style attributes and dynamic attribute values ​​in each of the page style categories are deduplicated to obtain the page style file.

7. A page style generating device, characterized in that: The device comprises: A static attribute acquisition module is used to acquire corresponding static page style attributes according to the target page style; A static attribute splitting module, used for splitting each of the static page style attributes into a plurality of static page style sub-attributes; A page style writing module, used to determine the static attribute value corresponding to the static page style sub-attribute according to the target page style, and combine the various static page style sub-attributes into different page style categories and write them into a hypertext markup language file; wherein each of the page style categories includes one or more static page style sub-attributes and corresponding static attribute values, and the static attribute values ​​of the static page style sub-attributes in each of the page style categories support individual modification; A page style parsing module, used to parse the hypertext markup language file and generate a page style file; The page style generation module is used to load the page style file and generate the target page style.

8. The device according to claim 7, characterized in that The device also includes a dynamic attribute editing module, which is used to: Acquire dynamic page style attributes according to the target page style; Writing the dynamic page style attribute and the dynamic attribute value corresponding to the dynamic page style attribute into the hypertext markup language file according to a preset dynamic editing method; wherein the dynamic attribute value corresponding to the dynamic page style attribute supports separate modification; When parsing the hypertext markup language file, the page style parsing module is specifically used to: The dynamic page style attributes and dynamic attribute values ​​in the hypertext markup language file are parsed using a preset parser to obtain dynamic page style information, and the dynamic page style information is added to the page style information; the preset parser includes the dynamic editing method.

9. An electronic device, characterized in that: include: processor; a memory for storing instructions executable by the processor; The processor is configured to execute the instructions to implement the page style generation method as described in any one of claims 1 to 6.

10. A computer-readable storage medium, characterized in that: When the instructions in the storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute the page style generating method as described in any one of claims 1 to 6.

Images