CN116737155A - Internet page generation method and device, storage medium and computer equipment - Google Patents
Internet page generation method and device, storage medium and computer equipment Download PDFInfo
- Publication number
- CN116737155A CN116737155A CN202310814814.8A CN202310814814A CN116737155A CN 116737155 A CN116737155 A CN 116737155A CN 202310814814 A CN202310814814 A CN 202310814814A CN 116737155 A CN116737155 A CN 116737155A
- Authority
- CN
- China
- Prior art keywords
- data
- exchange format
- page
- style
- data exchange
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 44
- 238000013461 design Methods 0.000 claims abstract description 67
- 238000000547 structure data Methods 0.000 claims abstract description 49
- 238000011161 development Methods 0.000 claims abstract description 25
- 238000009877 rendering Methods 0.000 claims abstract description 13
- 230000006870 function Effects 0.000 claims description 22
- 238000004590 computer program Methods 0.000 claims description 8
- 230000008569 process Effects 0.000 claims description 7
- 125000004122 cyclic group Chemical group 0.000 claims description 4
- 230000004044 response Effects 0.000 claims description 3
- 238000005516 engineering process Methods 0.000 abstract description 3
- 230000036541 health Effects 0.000 abstract description 2
- 230000000875 corresponding effect Effects 0.000 description 76
- 238000006243 chemical reaction Methods 0.000 description 10
- 238000003745 diagnosis Methods 0.000 description 9
- 230000009471 action Effects 0.000 description 4
- 238000004891 communication Methods 0.000 description 4
- 238000010586 diagram Methods 0.000 description 3
- 238000006757 chemical reactions by type Methods 0.000 description 2
- 230000002860 competitive effect Effects 0.000 description 2
- 230000000694 effects Effects 0.000 description 2
- 230000010365 information processing Effects 0.000 description 2
- 230000003252 repetitive effect Effects 0.000 description 2
- 229940079593 drug Drugs 0.000 description 1
- 239000003814 drug Substances 0.000 description 1
- 239000004744 fabric Substances 0.000 description 1
- 210000001503 joint Anatomy 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000010422 painting Methods 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/12—Use of codes for handling textual entities
- G06F40/151—Transformation
-
- G—PHYSICS
- G16—INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR SPECIFIC APPLICATION FIELDS
- G16H—HEALTHCARE INFORMATICS, i.e. INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR THE HANDLING OR PROCESSING OF MEDICAL OR HEALTHCARE DATA
- G16H40/00—ICT specially adapted for the management or administration of healthcare resources or facilities; ICT specially adapted for the management or operation of medical equipment or devices
- G16H40/60—ICT specially adapted for the management or administration of healthcare resources or facilities; ICT specially adapted for the management or operation of medical equipment or devices for the operation of medical equipment or devices
- G16H40/67—ICT specially adapted for the management or administration of healthcare resources or facilities; ICT specially adapted for the management or operation of medical equipment or devices for the operation of medical equipment or devices for remote operation
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Health & Medical Sciences (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Biomedical Technology (AREA)
- Software Systems (AREA)
- Databases & Information Systems (AREA)
- General Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- Business, Economics & Management (AREA)
- General Business, Economics & Management (AREA)
- Epidemiology (AREA)
- Medical Informatics (AREA)
- Primary Health Care (AREA)
- Public Health (AREA)
- Information Transfer Between Computers (AREA)
Abstract
The invention discloses a method and a device for generating an Internet page, a storage medium and computer equipment, and relates to the field of webpage design and development technology and medical health. The method comprises the following steps: acquiring data exchange format data obtained by analyzing interface design data of an Internet page; analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data, and determining page style data corresponding to the data exchange format level data; according to the page style data, determining a target style component corresponding to the page style data in preset style components, and replacing data exchange format level data based on the target style component to obtain page structure data; and rendering the page structure data to obtain the Internet page. The method can obviously improve the development efficiency of the Internet pages.
Description
Technical Field
The invention relates to the field of webpage design and development technology and medical health, in particular to a method and a device for generating an internet page, a storage medium and computer equipment.
Background
With the rapid development of internet technology, consumer electronics and online medical service fields, internet information presented by internet service parties providing online diagnosis and treatment and online medical services is various, and online sales information of various medical services and medical medicines fills personal terminals of people. Meanwhile, the timeliness requirement for acquiring medical information is gradually increased when the public purchases medical services and medical problem consultation online, and people browse the medical information through mobile phone terminals, tablet computers and other electronic terminals more and more, so as to perform online medical and medical service purchasing activities and acquire latest medical commodity sales promotion information. Meanwhile, internet service parties providing online diagnosis and treatment and online medical services hope to get the lead in more and more aggressive industry competition, and the generation work of more medical service providing pages must be completed at the fastest speed so as to provide various online activities entrance and medical service information pages for vast users.
Currently, the existing generation mode of the internet page is mostly based on related Interface (UI) personnel to generate a design draft, and the design draft is compiled by a front-end development technician, and code information compiled by the front-end development technician is rendered to complete the generation work of the internet page.
However, the above-mentioned technical manner requires a lot of editing time for related developers to perform a lot of repetitive work, and cannot generate a lot of internet pages in a short time, so that the development efficiency of the internet pages is seriously reduced, and the competitive power of the internet service provider in competition is greatly affected.
Disclosure of Invention
In view of this, the application provides a method, a device, a storage medium and a computer device for generating an internet page, which mainly aims to solve the technical problem that the generation efficiency of the internet page is low in the development process of the internet page.
According to a first aspect of the present application, there is provided a method for generating an internet page, the method comprising:
acquiring data exchange format data obtained by analyzing the interface design data of the Internet page;
analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data, and determining page style data corresponding to the data exchange format level data;
determining a target style component corresponding to the page style data in preset style components according to the page style data, and replacing the data exchange format level data based on the target style component to obtain page structure data;
And rendering the page structure data to obtain the Internet page.
According to a second aspect of the present invention, there is provided an apparatus for generating an internet page, the apparatus comprising:
the data acquisition module is used for acquiring data exchange format data obtained by analyzing the interface design data of the Internet page;
the style acquisition module is used for analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data and determining page style data corresponding to the data exchange format level data;
the structure determining module is used for determining a target style component corresponding to the page style data in preset style components according to the page style data, and replacing the data exchange format level data based on the target style component to obtain page structure data;
and the page generation module is used for rendering the page structure data to obtain the Internet page.
According to a third aspect of the present invention, there is provided a storage medium having stored thereon a computer program which, when executed by a processor, implements the above-described method of generating internet pages.
According to a fourth aspect of the present application, there is provided a computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, the processor implementing the method of generating internet pages described above when executing the program.
The application provides a method, a device, a storage medium and computer equipment for generating an Internet page, which are characterized in that firstly, data exchange format data obtained by analyzing interface design data of the Internet page is obtained, wherein the interface design data can be a UI design draft provided by a UI designer, and the UI design draft can contain design information of components such as a service module, a functional component and the like which are displayed in the Internet page; the UI design script may be processed to obtain data exchange format data corresponding to the UI design script, where the data exchange format data may be JSON (JavaScript Object Notation) data, extensible markup language (Extensible Markup Language, XML) data, or the like. Then, analyzing the data exchange format data to obtain data exchange format level data contained in the data exchange format data; here, the data exchange format level data may be code information corresponding to components such as a service module and a functional component that are displayed in the internet page; further, page style data including component coordinates, component height, component width, and pop-up component information for each data exchange format level data is determined. And selecting a reaction style component corresponding to the page style data from a plurality of preset reaction style components based on the page style data, wherein the reaction style component is an independent and reusable code unit for constructing a user interface. Each exact style component encapsulates specific functions and states. Further, replacing the data exchange format level data by the preset compact style component, and converting the data exchange format data into a complete compact page structure. And finally, rendering the compact page structure to obtain the Internet page. According to the technical scheme provided by the application, based on the UI design manuscript provided by a UI designer, the JSON level data corresponding to each business module, functional module and other modules is replaced based on the preset reaction type module, so that a reaction page structure is quickly constructed, the generation efficiency of an Internet page is greatly improved, more medical consultation pages are provided in a short time, and the timeliness requirement of the public on acquisition of medical information when on-line purchase of medical services and medical problem consultation is met.
The foregoing description is only an overview of the present application, and is intended to be implemented in accordance with the teachings of the present application in order that the same may be more clearly understood and to make the same and other objects, features and advantages of the present application more readily apparent.
Drawings
The accompanying drawings, which are included to provide a further understanding of the application and are incorporated in and constitute a part of this specification, illustrate embodiments of the application and together with the description serve to explain the application and do not constitute a limitation on the application. In the drawings:
fig. 1 shows a flow diagram of a method for generating an internet page according to an embodiment of the present application;
fig. 2 is a schematic structural diagram of an internet page generating device according to an embodiment of the present application;
fig. 3 is a schematic structural diagram of another device for generating an internet page according to an embodiment of the present application.
Detailed Description
The application will be described in detail hereinafter with reference to the drawings in conjunction with embodiments. It should be noted that, without conflict, the embodiments of the present application and features of the embodiments may be combined with each other.
Currently, the existing generation mode of the internet page is mostly based on related Interface (UI) personnel to generate a design draft, and the design draft is submitted to a front-end development technician for code writing so as to realize the generation work of the internet page. However, the above-mentioned technical manner requires a lot of editing time for related developers to perform a lot of repetitive work, and cannot generate a lot of internet pages in a short time, so that the development efficiency of the internet pages is seriously reduced, enough medical consultation pages cannot be provided quickly, the timeliness requirement of the public on medical information acquisition cannot be met, and the competitive power of the internet service provider in competition is greatly affected.
In view of the foregoing problems, in one embodiment, as shown in fig. 1, a method for generating an internet page is provided, and a computer device to which the method is applied in an online medical service scenario is taken as an example for explanation, it should be noted that this embodiment is illustrated in an online medical service scenario, and other scenarios are also applicable to this embodiment, where the method includes the following steps:
101. and acquiring data exchange format data obtained by analyzing the interface design data of the Internet page.
The interface design data may be a UI design draft developed by a UI designer for carrying on-line medical information, where the UI design draft may include design information of components such as a service module and a functional component displayed in an internet page, and specifically includes Style attribute information such as coordinate information, popup layer component information, style compiled file, color information, height information, and width information of each component. Further, the interface design data can be analyzed to obtain data exchange format data, such as JSON data, XML data, and the like, corresponding to the interface design data. Here, the embodiment uses JSON data as data exchange format data, where JSON data is lightweight data exchange format data, and is easy to read and write and easy to parse and generate by a machine.
Specifically, the UI design draft can be obtained from the operation terminal of the UI designer and converted into data exchange format data, or the data exchange format data after analysis can be directly obtained, so as to improve the generation efficiency of the web page.
102. Analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data, and determining page style data corresponding to the data exchange format level data.
The data exchange format hierarchical data may be JSON hierarchical data obtained by layering JSON data. Here, layering JSON data may obtain a plurality of JSON level data, each JSON level data may represent data corresponding to a specific page service module or a functional component in the UI design draft; meanwhile, the JSON level data can contain editable or custom contents such as medical documents, color values and the like, and is convenient for later-stage developers to replace the editable or custom contents. As an example, if the UI design draft includes three components of a medical service, an online consultation, and a medical commodity, where the medical service component is independently disposed in a page, and the online consultation component is disposed in the page within the medical commodity component, at this time, the JSON data may include JSON level data corresponding to the medical service component, JSON level data corresponding to the online consultation component, and JSON level data corresponding to the medical commodity component; the code configuration information of the on-line consultation component is contained in the medical commodity component between the JSON level data corresponding to the on-line consultation component and the JSON level data corresponding to the medical commodity component.
Specifically, the array and the object of the JSON data can be analyzed based on the string information of the JSON data, so as to obtain each JSON level data contained in the JSON data. Here, each JSON hierarchical data includes Style attribute information such as corresponding coordinate information, popup layer component information, style compiled file, color information, height information, and width information, and a hierarchical relationship between the parent component and the child component, which may be collected and stored locally for subsequent use.
103. And determining a target style component corresponding to the page style data in preset style components according to the page style data, and replacing the data exchange format level data based on the target style component to obtain page structure data.
The style component may be a compact style component, which is an independent and reusable code unit for constructing a user interface, and each compact component encapsulates a specific function and state, and may be developed, tested, and maintained as an independent unit. The relevant sender can prefabricate a plurality of exact style components for different page style data according to design specifications in advance and store the exact style components locally. Here, style components include, but are not limited to, picture components, line components, text components, and the like.
As an example, if the UI design draft includes two components of online diagnosis and treatment and online medical service, the online diagnosis and treatment component and the online medical service component are independently disposed in the page. Firstly, page style data corresponding to two components of online diagnosis and treatment and online medical service can be obtained based on JSON level data corresponding to the two components of online diagnosis and treatment and online medical service respectively; and then, respectively acquiring two reaction style components with the same page style data as the online diagnosis and treatment and online medical service components from the preset reaction style components, replacing JSON (Java Server on-line) level data of the online diagnosis and treatment components based on the target style components corresponding to the online diagnosis and treatment components, and replacing the JSON level data of the online medical service components by the target style components corresponding to the online medical service components to obtain page structure data corresponding to the UI design manuscript. Here, the replaced exact style component can retain editable or custom content such as text, color values and the like contained in the original JSON level data, so that later-stage developers can conveniently replace the editable or custom content.
And S104, rendering the page structure data to obtain the Internet page.
Specifically, page style data of each component contained in the exact style component is used as a spatial rendering parameter of the component. Meanwhile, based on the positions of the exact style components and the inclusion relation of the components on the page, the internet page meeting the requirements can be rendered in the cloth painting.
Firstly, data exchange format data obtained by analyzing interface design data of an internet page is obtained, wherein the interface design data can be a UI design draft provided by a UI designer, and the UI design draft can contain design information of components such as a service module, a functional component and the like which are displayed in the internet page; the UI design script may be processed to obtain data exchange format data corresponding to the UI design script, where the data exchange format data may be JSON (JavaScript Object Notation) data, extensible markup language (Extensible Markup Language, XML) data, or the like. Then, analyzing the data exchange format data to obtain data exchange format level data contained in the data exchange format data; here, the data exchange format level data may be code information corresponding to components such as a service module and a functional component that are displayed in the internet page; further, page style data including component coordinates, component height, component width, and pop-up component information for each data exchange format level data is determined.
Further, based on the page style data, a reaction style component corresponding to the page style data is selected from a plurality of preset reaction style components, wherein the reaction style component is an independent and reusable code unit for constructing a user interface. Each exact style component encapsulates specific functions and states. Further, replacing the data exchange format level data by the preset compact style component, and converting the data exchange format data into a complete compact page structure. And finally, rendering the compact page structure to obtain the Internet page. According to the technical scheme provided by the application, based on the UI design manuscript provided by a UI designer, the JSON level data corresponding to each business module, functional module and other modules are replaced based on the preset reaction type module, so that the reaction page structure is quickly constructed, the generation efficiency of an Internet page is greatly improved, more medical consultation pages can be supplied in a short time, and the timeliness requirement of the public on medical information acquisition during online purchase of medical services and medical problem consultation is met.
In one embodiment, the implementation of parsing the data exchange format data and determining the data exchange format hierarchy data existing in the data exchange format data in step 102 may be: first, the data exchange format data is determined as parent data exchange format data, where the page can be temporarily handled as an integral component. Specifically, the data exchange format data is used as a parent data exchange format data as a whole. Then, a cyclic process is performed until a preset condition is satisfied, wherein the cyclic process includes: and judging whether the parent data exchange format data contains the child data exchange format data according to the code information of the parent data exchange format data. Specifically, the code of the parent data exchange format data can be traversed, whether the component corresponding to the parent data exchange format data contains a child component nested in the component is judged, and if the component corresponding to the parent data exchange format data contains the child component nested in the component based on the code, the data exchange format data corresponding to the child component is determined to be the child data exchange format data.
Further, if the parent data exchange format data includes the child data exchange format data, determining the parent data exchange format data as the data exchange format level data. Specifically, if the parent data exchange format data has child data exchange format data contained therein, the parent data exchange format data is determined as data exchange format level data, and the relationship between the data exchange format level data and the child data exchange format data contained therein is recorded. Further, the child data exchange format data is determined as the parent data exchange format data. Specifically, after the parent data exchange format data including the child data exchange format data is determined as the data exchange format level data, the obtained child data exchange format data may be determined as the parent data exchange format data, and the step of judging whether the parent data exchange format data includes the child data exchange format data according to the code information of the parent data exchange format data is re-executed. Until all data exchange format level data are determined from the data exchange format data, and the contained and contained relations among the data exchange format level data are determined as level relations.
Further, the preset conditions are as follows: and judging whether the parent data exchange format data contains the child data exchange format data or not according to the judging result that the parent data exchange format data does not contain the child data exchange format data. Specifically, after determining, layer by layer, the components of the lowest level that do not contain any components, execution of the loop ends. And finally, determining the sub-level data exchange format data as the data exchange format level data, and determining the level relation among the data exchange format level data. Specifically, sub-level data exchange format data corresponding to a component of the lowest hierarchy that does not contain any component is determined as data exchange format hierarchy data, and a relationship between contained and contained between each data exchange format hierarchy data is determined. According to the embodiment of the application, each JSON level data contained in the JSON data can be rapidly determined, and the containing and contained relation of the module or the component corresponding to each JSON level data is determined, so that the development efficiency of the Internet page is improved.
In one embodiment, the implementation method for replacing the data exchange format hierarchy data based on the target style component in step 103 to obtain page structure data includes: first, a hierarchical tree is established containing all of the data exchange format hierarchical data according to the hierarchical relationship. Wherein each hierarchical element in the hierarchical tree corresponds to one of the data exchange format hierarchical data; here, the hierarchical tree may be a document object model (Document Object Model, DOM) hierarchical tree, which is a hierarchy of all modules or components in a web page. Wherein each HTML tag, text node, and attribute are represented in the DOM hierarchy tree as a node, which is an object that can be accessed and manipulated through JavaScript or other scripting language. Further, the DOM hierarchical tree represents the structure of the web page step by step downwards from the root node of the web page. The root node corresponds to the </u > of the HTML document! DOCTYPE html tags, followed by < html > tags, followed by < head > tags and < body > tags and tag information, and finally text nodes, which may be mutually contained and nested to form a tree structure.
Specifically, each data exchange format level data is used as a level element, the DOM level tree is constructed step by step based on the contained and contained level relation of each data exchange format level data, and meanwhile, the Style attribute information such as the coordinate information, the popup layer component information, the Style compiling file, the color information, the height information, the width information and the like corresponding to each data exchange format level data is contained in the level element.
And then, determining the target style component corresponding to each hierarchical element based on page style data corresponding to each hierarchical element, and replacing the hierarchical element with the target style component corresponding to the hierarchical element to obtain page structure data corresponding to the hierarchical relationship. Specifically, a developer may prefabricate a plurality of style components for different page style data in advance according to a design specification, and store the style components locally. When the hierarchical element needs to be replaced, according to page style data contained in the hierarchical element, a style component with the same page style data can be acquired from stored style components, and the style component is determined to be a target style component of the hierarchical element. Further, replacing the hierarchical element with a target style component corresponding to the hierarchical element to obtain page structure data corresponding to the hierarchical relationship. According to the embodiment provided by the application, the DOM hierarchical tree containing all data exchange format hierarchical data can be established based on the hierarchical relation among the data exchange format hierarchical data, each hierarchical element in the DOM hierarchical tree is replaced by the action style component corresponding to the hierarchical element step by step, and page structure data is obtained efficiently.
In one embodiment, the implementation of replacing the hierarchical element with the target style component corresponding to the hierarchical element may be: first, based on the target style component, replacing the hierarchical element corresponding to the target style component. Then, traversing the hierarchical tree, determining whether the hierarchical elements in the hierarchical tree that are not replaced by the target style component exist. Specifically, whether each hierarchical element is replaced with a relative target style component is determined step by step, and whether the hierarchical element which is not replaced with the target style component exists is judged. Further, if no hierarchical element which is not replaced by the target style component exists, the page structure data can be rendered to obtain an Internet page. In contrast, if the hierarchical element which is not replaced by the target style component exists, determining the hierarchical element as a target hierarchical element, and responding to the input configuration operation, obtaining an input style component corresponding to the target hierarchical element. Here, if there is a hierarchical element that is not replaced by the target style component, it is indicated that there is no style component corresponding to the hierarchical element in the pre-configured style components. At this time, the style component corresponding to the hierarchical element may be manually configured, and the obtained style component may be stored locally for subsequent use.
Specifically, if there is an unsubstituted hierarchical element, determining the hierarchical element as a target hierarchical element; further, a prompt message can be sent to related staff to enable the staff to configure a corresponding input style component for the target level element; and then, responding to the configuration operation of the generating style component input by the staff, and generating the input style component corresponding to the target level element. And finally, replacing the target hierarchy element with the input style component so that all hierarchy elements in the DOM hierarchy tree are replaced with corresponding style components to obtain complete page structure data. According to the embodiment provided by the application, each level element in the DOM level tree can be ensured to be replaced by the action pattern component, when the level element which is not replaced by the action pattern component exists, related personnel can be prompted to configure the corresponding action pattern component for replacement work, the action pattern component is stored locally, and further, the complete page structure data is ensured to be obtained for rendering.
In one embodiment, the method for obtaining the data exchange format data obtained by parsing the interface design data of the internet page may be: firstly, acquiring interface design data of the Internet page, and obtaining an interface design source file based on the interface design data. The interface design source file may be a sketch source file. Specifically, interface design data developed by a UI designer may be converted into a skin source file. And then, analyzing the interface design source file to obtain the data exchange format data corresponding to the interface design source file. Specifically, the sketch source file is parsed to obtain data exchange format data such as JSON data and XML data corresponding to the interface design data. The embodiment of the application can directly acquire the UI design manuscript provided by the designer and convert the UI design manuscript into the JSON data, XML data and other data types which can be read and identified by the system, thereby improving the convenience of page generation work.
In one embodiment, prior to step 104, further comprising: in response to a logic function addition request for the page structure data, the page structure data is transmitted to a development terminal, and the page structure data to which a logic function is added is received from the development terminal. The development terminal is used for adding logic functions to the page structure data to obtain the page structure data added with the logic functions. Specifically, when the generated page structure data further needs to add an additional logic function thereto, the relevant personnel may send a logic function adding request to the computer device running the method in this embodiment. Further, when a logic function adding request is received, the page structure data is sent to a development terminal, and prompt information is sent to relevant developers, so that the relevant developers can further develop the page structure data based on the development terminal. The development terminal may be a terminal device such as a computer used by a developer.
Finally, when the developer completes the logic adding work to the page structure data, the developed page structure data can be sent back, so that the computer device running the method in the embodiment obtains the page structure data for rendering finally. According to the embodiment of the application, the system can be directly in butt joint with the equipment of the UI designer and the developer added with the logic function, the UI design draft is directly obtained to carry out the Internet page generation work, the flow required by the page generation work is reduced, and the yield of the Internet page generation work is improved.
In one embodiment, in step 103, according to the page style data, an implementation manner of determining, in a preset style component, a target style component corresponding to the page style data may be: firstly, matching is carried out on the basis of the page style data and a preset style component comparison table. And the style component comparison table is recorded with comparison page style data and a preset style component corresponding to the comparison page style data.
Then, determining the comparison page style data matched with the page style data, and determining the preset style component corresponding to the comparison page style data as a target style component corresponding to the page style data. Specifically, if the length information, the width information, the Style compiled file, the color information and the like contained in the reference page Style data are the same as the page Style data, it may be determined that the length information, the width information, the Style compiled file, the color information and the like are matched with the page Style data, and further a preset Style component corresponding to the reference page Style data may be determined as a target Style component corresponding to the page Style data. According to the embodiment of the application, the target style component corresponding to the page style data can be rapidly determined, so that the subsequent work of replacing the data exchange format level data with the target style component can be performed, and the development efficiency of the Internet page is improved.
The method for generating the internet page provided by the embodiment can generate data exchange format data based on the UI design manuscript provided by the UI designer, and construct a DOM hierarchical tree based on a plurality of data exchange format hierarchical data in the data exchange format data; and then, replacing the hierarchical element data corresponding to each service module, functional component and other components of the DOM hierarchical tree based on a preset compact style component, quickly constructing a compact page structure, and carrying out logic function adding work on the compact page structure based on actual conditions, so that the generation efficiency of the Internet page is greatly improved.
Further, as a specific implementation of the method shown in fig. 1, the embodiment provides an apparatus for generating an internet page, as shown in fig. 2, where the apparatus includes: a data acquisition module 21, a style acquisition module 22, a structure determination module 23, and a page generation module 24.
The data acquisition module 21 may be configured to acquire data exchange format data obtained by parsing the interface design data of the internet page.
The style acquisition module 22 is configured to parse the data exchange format data, determine data exchange format level data existing in the data exchange format data, and determine page style data corresponding to the data exchange format level data.
The structure determining module 23 is configured to determine, according to the page style data, a target style component corresponding to the page style data from preset style components, and replace the data exchange format level data based on the target style component, so as to obtain page structure data.
And the page generating module 24 is configured to render the page structure data to obtain the internet page.
In a specific application scenario, the style obtaining module 22 may be specifically configured to determine the data exchange format data as parent data exchange format data; executing a circulation process until a preset condition is met, wherein the circulation process comprises: judging whether the parent data exchange format data contains child data exchange format data or not according to the code information of the parent data exchange format data; if the parent data exchange format data contains the child data exchange format data, determining the parent data exchange format data as the data exchange format level data; determining the child data exchange format data as the parent data exchange format data; the preset conditions are as follows: the judging result of judging whether the father data exchange format data contains the child data exchange format data is that the father data exchange format data does not contain the child data exchange format data; and determining the sub-level data exchange format data as the data exchange format level data, and determining the level relation among the data exchange format level data.
In a specific application scenario, the structure determining module 23 is specifically configured to establish a hierarchical tree containing all the data exchange format hierarchical data according to the hierarchical relationship, where each hierarchical element in the hierarchical tree corresponds to one data exchange format hierarchical data; and determining the target style component corresponding to each hierarchical element based on the page style data corresponding to each hierarchical element, and replacing the hierarchical element with the target style component corresponding to the hierarchical element to obtain page structure data corresponding to the hierarchical relationship.
In a specific application scenario, the structure determining module 23 is specifically configured to replace the hierarchical element corresponding to the target style component based on the target style component; traversing the hierarchical tree, and judging whether the hierarchical elements which are not replaced by the target style component exist in the hierarchical tree or not; if the hierarchy element which is not replaced by the target hierarchy element exists, determining the hierarchy element as a target hierarchy element, and responding to input configuration operation, obtaining an input style element corresponding to the target hierarchy element; the target hierarchy element is replaced with the input style component.
In a specific application scenario, the data acquisition module 21 may be specifically configured to acquire interface design data of the internet page, and obtain an interface design source file based on the interface design data; analyzing the interface design source file to obtain the data exchange format data corresponding to the interface design source file.
In a specific application scenario, the structure determining module 23 may be specifically configured to match a preset style component comparison table based on the page style data, where the style component comparison table records control page style data and a preset style component corresponding to the control page style data; determining the comparison page style data matched with the page style data, and determining the preset style component corresponding to the comparison page style data as a target style component corresponding to the page style data.
In a specific application scenario, as shown in fig. 3, the apparatus further includes a function adding module 34, where the function adding module 34 is specifically configured to send the page structure data to a development terminal in response to a logic function adding request for the page structure data, and receive the page structure data to which a logic function is added from the development terminal, where the development terminal is configured to add a logic function to the page structure data, so as to obtain the page structure data to which the logic function is added.
It should be noted that, other corresponding descriptions of each functional unit related to the generating device of the internet page provided in the embodiment may refer to corresponding descriptions in fig. 1, and are not repeated herein.
Based on the method shown in fig. 1, correspondingly, the present embodiment further provides a storage medium, on which a computer program is stored, where the program is executed by a processor to implement the method for generating an internet page shown in fig. 1.
Based on such understanding, the technical solution of the present application may be embodied in the form of a software product, where the software product to be identified may be stored in a non-volatile storage medium (may be a CD-ROM, a U-disc, a mobile hard disk, etc.), and include several instructions for causing a computer device (may be a personal computer, a server, or a network device, etc.) to execute the method described in the various implementation scenarios of the present application.
Based on the method shown in fig. 1 and the embodiment of the generating device of the internet page shown in fig. 2 and 3, in order to achieve the above objective, the embodiment further provides an entity device for generating the internet page, which may specifically be a personal computer, a server, a smart phone, a tablet computer, a smart watch, or other network devices, where the entity device includes a storage medium and a processor; a storage medium storing a computer program; a processor for executing a computer program to implement the method as described above and shown in fig. 1.
Optionally, the physical device may further include a user interface, a network interface, a camera, radio Frequency (RF) circuitry, sensors, audio circuitry, WI-FI modules, and the like. The user interface may include a Display screen (Display), an input unit such as a Keyboard (Keyboard), etc., and the optional user interface may also include a USB interface, a card reader interface, etc. The network interface may optionally include a standard wired interface, a wireless interface (e.g., WI-FI interface), etc.
It will be appreciated by those skilled in the art that the structure of the entity device for generating the internet page provided in this embodiment is not limited to the entity device, and may include more or fewer components, or some components may be combined, or different arrangements of components.
The storage medium may also include an operating system, a network communication module. The operating system is a program for managing the entity equipment hardware and the software resources to be identified, and supports the operation of the information processing program and other software and/or programs to be identified. The network communication module is used for realizing communication among all components in the storage medium and communication with other hardware and software in the information processing entity equipment.
From the above description of the embodiments, it will be apparent to those skilled in the art that the present application may be implemented by means of software plus necessary general hardware platforms, or may be implemented by hardware. By applying the technical scheme of the application, firstly, data exchange format data obtained by analyzing the interface design data of the Internet page is obtained; then, analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data, and determining page style data corresponding to the data exchange format level data; then, according to the page style data, determining a target style component corresponding to the page style data in preset style components, and replacing the data exchange format level data based on the target style component to obtain page structure data; and finally, rendering the page structure data to obtain the Internet page. Compared with the prior art, the development efficiency of the Internet page can be remarkably improved.
Those skilled in the art will appreciate that the drawing is merely a schematic illustration of a preferred implementation scenario and that the modules or flows in the drawing are not necessarily required to practice the application. Those skilled in the art will appreciate that modules in an apparatus in an implementation scenario may be distributed in an apparatus in an implementation scenario according to an implementation scenario description, or that corresponding changes may be located in one or more apparatuses different from the implementation scenario. The modules of the implementation scenario may be combined into one module, or may be further split into a plurality of sub-modules.
The above-mentioned inventive sequence numbers are merely for description and do not represent advantages or disadvantages of the implementation scenario. The foregoing disclosure is merely illustrative of some embodiments of the application, and the application is not limited thereto, as modifications may be made by those skilled in the art without departing from the scope of the application.
Claims (10)
1. A method for generating an internet page, the method comprising:
acquiring data exchange format data obtained by analyzing the interface design data of the Internet page;
analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data, and determining page style data corresponding to the data exchange format level data;
determining a target style component corresponding to the page style data in preset style components according to the page style data, and replacing the data exchange format level data based on the target style component to obtain page structure data;
and rendering the page structure data to obtain the Internet page.
2. The method of claim 1, wherein said parsing the data exchange format data to determine data exchange format level data present within the data exchange format data comprises:
Determining the data exchange format data as parent data exchange format data;
executing a cyclic process until a preset condition is met, wherein the cyclic process comprises:
judging whether the parent data exchange format data contains child data exchange format data or not according to the code information of the parent data exchange format data;
if the parent data exchange format data contains the child data exchange format data, determining the parent data exchange format data as the data exchange format level data;
determining the child data exchange format data as the parent data exchange format data;
the preset condition is that the judging result of judging whether the father data exchange format data contains the son data exchange format data is: the parent data exchange format data does not contain the child data exchange format data;
and determining the sub-level data exchange format data as the data exchange format level data, and determining the level relation among the data exchange format level data.
3. The method of claim 2, wherein replacing the data exchange format level data based on the target style component results in page structure data, comprising:
Establishing a hierarchical tree containing all data exchange format hierarchical data according to the hierarchical relationship, wherein each hierarchical element in the hierarchical tree corresponds to one data exchange format hierarchical data;
and determining the target style component corresponding to each hierarchical element, and replacing the hierarchical element with the target style component corresponding to the hierarchical element to obtain page structure data corresponding to the hierarchical relationship.
4. A method according to claim 3, wherein said replacing the hierarchical element with the target style component corresponding to the hierarchical element comprises:
replacing the hierarchical elements corresponding to the target style component based on the target style component;
traversing the hierarchical tree, and judging whether the hierarchical elements which are not replaced by the target style component exist in the hierarchical tree or not;
if the hierarchy element which is not replaced by the target hierarchy element exists, determining the hierarchy element as a target hierarchy element, and responding to input configuration operation, obtaining an input style element corresponding to the target hierarchy element;
the target hierarchy element is replaced with the input style component.
5. The method according to any one of claims 1 to 4, wherein the obtaining data exchange format data parsed from the interface design data of the internet page includes:
acquiring interface design data of the Internet page, and acquiring an interface design source file based on the interface design data;
analyzing the interface design source file to obtain the data exchange format data corresponding to the interface design source file.
6. The method of claim 1, wherein the rendering the page structure data, prior to obtaining the internet page, further comprises:
transmitting the page structure data to a development terminal in response to a logic function addition request for the page structure data, and receiving the page structure data to which a logic function is added from the development terminal,
the development terminal is used for adding logic functions to the page structure data to obtain the page structure data added with the logic functions.
7. The method according to claim 1, wherein the determining, according to the page style data, a target style component corresponding to the page style data from preset style components includes:
Matching is carried out on the basis of the page style data and a preset style component comparison table, wherein the style component comparison table is recorded with comparison page style data and preset style components corresponding to the comparison page style data;
determining the comparison page style data matched with the page style data, and determining the preset style component corresponding to the comparison page style data as a target style component corresponding to the page style data.
8. An apparatus for generating an internet page, the apparatus comprising:
the data acquisition module is used for acquiring data exchange format data obtained by analyzing the interface design data of the Internet page;
the style acquisition module is used for analyzing the data exchange format data, determining data exchange format level data existing in the data exchange format data and determining page style data corresponding to the data exchange format level data;
the structure determining module is used for determining a target style component corresponding to the page style data in preset style components according to the page style data, and replacing the data exchange format level data based on the target style component to obtain page structure data;
And the page generation module is used for rendering the page structure data to obtain the Internet page.
9. A storage medium having stored thereon a computer program, which when executed by a processor, implements the steps of the method of any of claims 1 to 7.
10. A computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, characterized in that the computer program when executed by the processor implements the steps of the method according to any one of claims 1 to 7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202310814814.8A CN116737155A (en) | 2023-07-04 | 2023-07-04 | Internet page generation method and device, storage medium and computer equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202310814814.8A CN116737155A (en) | 2023-07-04 | 2023-07-04 | Internet page generation method and device, storage medium and computer equipment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN116737155A true CN116737155A (en) | 2023-09-12 |
Family
ID=87915005
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202310814814.8A Pending CN116737155A (en) | 2023-07-04 | 2023-07-04 | Internet page generation method and device, storage medium and computer equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN116737155A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117311709A (en) * | 2023-09-18 | 2023-12-29 | 深圳市联医科技有限公司 | Page design system and electronic equipment applied to Internet nursing software |
-
2023
- 2023-07-04 CN CN202310814814.8A patent/CN116737155A/en active Pending
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117311709A (en) * | 2023-09-18 | 2023-12-29 | 深圳市联医科技有限公司 | Page design system and electronic equipment applied to Internet nursing software |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10592319B2 (en) | API notebook tool | |
| CN112099768B (en) | Business process processing method and device and computer readable storage medium | |
| US10409566B2 (en) | Web-based scan-task enabled system, and method of and apparatus for developing and deploying the same on a client-server network | |
| Marrs | JSON at work: practical data integration for the web | |
| CN103389895B (en) | A kind of generation method and system of front end page | |
| Kuutti | Work processes: Scenarios as a preliminary vocabulary | |
| CN106980508A (en) | Method and apparatus for generating the page | |
| CN111428177A (en) | Method and system for WEB content generation | |
| CN112764736B (en) | Web end flow chart modeling method, device and system | |
| Chiprianov et al. | Extending enterprise architecture modeling languages for domain specificity and collaboration: application to telecommunication service design | |
| CN114036425A (en) | Page access method, client, server and system | |
| CN116737155A (en) | Internet page generation method and device, storage medium and computer equipment | |
| CN111880813B (en) | Method for realizing android card UI (user interface) and storage medium | |
| CN106484488B (en) | Integrated cloud Compilation Method and system | |
| CN113239310A (en) | Page loading method and related device | |
| CN112114805A (en) | Page generation method, device and equipment | |
| CN116414370A (en) | Platform construction method and device based on low codes, medium and electronic equipment | |
| CN110162301B (en) | Form rendering method, form rendering device and storage medium | |
| Achilleos et al. | A model-driven framework for developing web service oriented applications | |
| CN110780874A (en) | Method and apparatus for generating information | |
| CN109740074B (en) | Method, device and equipment for processing parameter configuration information | |
| CN112732254B (en) | Webpage development method, webpage development device, computer equipment and storage medium | |
| CN111176624B (en) | Method and device for generating stream type calculation index | |
| CN116431139A (en) | Component assembly model, interface generation method, device, medium and equipment | |
| CN111367515B (en) | Page card development method, device, computing equipment and storage medium |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |