WO2017124952A1 - 一种网页脚本加载方法和装置 - Google Patents

一种网页脚本加载方法和装置 Download PDF

Info

Publication number
WO2017124952A1
WO2017124952A1 PCT/CN2017/070890 CN2017070890W WO2017124952A1 WO 2017124952 A1 WO2017124952 A1 WO 2017124952A1 CN 2017070890 W CN2017070890 W CN 2017070890W WO 2017124952 A1 WO2017124952 A1 WO 2017124952A1
Authority
WO
WIPO (PCT)
Prior art keywords
script
file
html
cascading style
dependency
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.)
Ceased
Application number
PCT/CN2017/070890
Other languages
English (en)
French (fr)
Inventor
郑欣
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Alibaba Group Holding Ltd
Original Assignee
Alibaba Group Holding Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Alibaba Group Holding Ltd filed Critical Alibaba Group Holding Ltd
Publication of WO2017124952A1 publication Critical patent/WO2017124952A1/zh
Anticipated expiration legal-status Critical
Ceased legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING OR CALCULATING; COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/445—Program loading or initiating
    • G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
    • G—PHYSICS
    • G06—COMPUTING OR CALCULATING; COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/445—Program loading or initiating

Definitions

  • the present application relates to the field of webpage technologies, and in particular, to a webpage script loading method and a webpage script loading apparatus.
  • the front end in web development is a program running on the browser side; the front end is something that users can see and see in the web application, including the web.
  • the backend for the server, it should be developed for the server side accurately, the program that provides the data is running in the server; the back end is more to interact with the database to handle the corresponding business logic. What needs to be considered is how to implement functions, data access, platform stability and performance.
  • embodiments of the present application have been made in order to provide a webpage script loading method and a corresponding webpage script loading apparatus that overcome the above problems or at least partially solve the above problems.
  • a webpage script loading method including:
  • the dependency of the first script includes an html file
  • the html file is obtained by a third-party plug-in and rendered
  • the third-level plug-in obtains each level of the style file and renders;
  • the application also discloses a webpage script loading device, comprising:
  • a first script loading module for loading the first script
  • a dependency parsing module configured to parse a dependency of the first script according to a dependency definition for the first script
  • a second script processing module configured to: when the dependency of the first script includes each second script, acquire each second script to load;
  • An html file processing module configured to: when the dependency of the first script includes an html file, obtain the html file by using a third-party plug-in and render;
  • a cascading style file processing module configured to: when the dependency of the first script includes a plurality of style files, acquire a style file of each level through a third-party plug-in and render;
  • the first script execution module is configured to execute the business logic of the first script after all the dependencies of the first script are processed.
  • the corresponding function modules of the webpage may be preset in advance.
  • Second script, html (HyperText Mark-up Language) files for each business or function, CSS (Cascading Style Sheets) files for each script, and then for a certain business of the web page or Function, if it needs a corresponding second script, html file, cascading style sheet, then the second script that the first script depends on may be defined in the dependency definition of the first script corresponding to the business or function, html Files and individual CSS files. Then, after obtaining the first script, the client first parses the dependent second script, html file, cascading style sheet file and the like from its dependency definition.
  • the second script is first loaded for loading; for the html file, the html file can be obtained and rendered by the third-party plug-in; for the cascading style file, the third-level plug-in can obtain the style files of each level and Rendering, after all the dependencies of the first script are processed, the client executes the code of the business logic of the first script.
  • the dependencies of each service of the webpage code are clear, the code reusability of each function is strong, the code amount can be reduced, the webpage code structure is clear, the logic of each service can be decoupled, the webpage code can be easily modified, and the business splitting is facilitated. jobs.
  • FIG. 1 is a flow chart of steps of an embodiment of a webpage script loading method of the present application
  • FIG. 2 is a flow chart of steps of another embodiment of a webpage script loading method of the present application.
  • 2A is a logical example diagram of a webpage script loading method of the present application
  • FIG. 3 is a structural block diagram of an embodiment of a webpage script loading apparatus of the present application.
  • a corresponding second script a html (HyperText Mark-up Language) file of each service or function, and each of the function modules required for each web page may be preset.
  • the CSS CSS
  • the table may define, in the dependency definition of the corresponding first script, each second script, html file and each css file on which the first script depends.
  • the client can utilize requirejs (requirejs is a JavaScript module loading framework, which is one of the implementers of the AMD (Asynchronous Module Definition) specification), etc., first from The second script, html file, and cascading style file whose dependencies are resolved in the dependency definition.
  • the html file can be obtained and rendered by a third-party plug-in;
  • the cascading style file can be obtained and rendered by the third-party plug-in, after all the dependencies of the first script are completely processed.
  • the client then executes the code of the business logic of the first script.
  • FIG. 1 a flow chart of steps of an embodiment of a webpage script loading method of the present application is shown, which may specifically include the following steps:
  • Step 110 loading a first script
  • the loading interface of the first script may be preset in the html code of the main html document of the webpage. For example, add the above load interface in the ⁇ script> of the html code.
  • the load interface of the requirejs library is used.
  • the loading interface of the first script may also be added in other locations, which is not limited in the embodiment of the present application.
  • a loading interface of the first script may be added to the webpage code, and a loading interface of the plurality of first scripts may be added, which is not limited in the embodiment of the present application.
  • the business logic of each first script is different.
  • the client obtains the main html document, parsing the html code therein, and when parsing the loading interface of the first script, acquiring the corresponding first script from the server, and then loading the first script.
  • a dependency definition is preset, for example, one or more second scripts, html files, and CSS files that the first script depends on are defined in the main function of the first script. . Then place the dependent second scripts, and/or html files, and/or CSS files under the folder of the corresponding path of the server.
  • the client can be a browser or other program or application capable of processing html code.
  • the browser can be a personal computer browser or a browser of a smart mobile terminal. The embodiments of the present application do not limit them.
  • Step 120 Parse the dependency of the first script according to a dependency definition for the first script.
  • the present application sets a dependency definition for the first script in advance, after loading the first script, the dependency of the first script is first parsed from the dependency definition of the first script.
  • a second script that writes a requirement in the dependency definition of the first script may be a second script, and/or an html file, and/or a CSS file according to a business requirement, according to a technical developer on the server side. And / or html files, and / or CSS files. Then, in the embodiment of the present application, there may be multiple situations when parsing the dependency of the first script, such as:
  • the CSS file can be a CSS file for the first script.
  • the multiple CSS files may be CSS files for some of the first script and the second script.
  • the CSS file can be a CSS file for the first script.
  • the multiple CSS files may be CSS files for some of the first script and the second script.
  • the dependency of the first script is parsed, and according to the preset situation, it may be resolved to the above several cases.
  • Step 130 When the dependency of the first script includes each second script, acquire each second script to load;
  • each second script is acquired from the server under the folder of the foregoing path, and then each second script may be loaded.
  • the second script when the first script depends on one or some second scripts, and the second script is also used as the identity of the first script, after loading the first script, performing steps 120-160 .
  • Step 140 When the dependency of the first script includes an html file, the html file is obtained and rendered by a third-party plug-in;
  • a third-party plug-in of requirejs may be loaded for the client when the client accesses the webpage or before. Then if the dependencies obtained by the above parsing include html files, you can obtain them from the server through the third-party plugin of requirejs in the folder of the aforementioned path. Each html file can then be rendered based on the html file.
  • the html file is rendered corresponding to a sub-interface of the webpage of the foregoing main html document.
  • the html file includes an html template, user data, and an internationalization file.
  • the user data includes service data such as user personalized information.
  • the html template is a predetermined various page templates, and the html template includes at least a plurality of fields filled in data, such as fields filled in various personalized information of the user and fields filled in the internationalized copy data.
  • step 140 includes sub-steps 141-143:
  • Sub-step 141 obtaining an html template, user data, and an internationalization file
  • the html file that the first script depends on includes an html template, user data, and an internationalization file. This application can obtain html templates, user data and internationalization files.
  • sub-step 141 includes sub-step A11:
  • Sub-step A11 acquiring an html template of the text type of the html template.
  • the third-party plugin for requirejs takes the text file type, from the server or html template file, and then stores it into memory.
  • the client (such as a browser) can directly obtain the code of the html template, and then directly parse and render the code of the html template, resulting in no actual data display in the rendered webpage.
  • Sub-step 142 calling a template rendering engine, splicing the html template, user data, and internationalization file into an html code;
  • the template rendering engine may be invoked, and the user data and the internationalization file are filled into the html template to obtain the html code.
  • the template rendering engine may be ejs (EJS is the default of Canjs). Template language) template rendering engine.
  • the html template file, user data, and internationalization files can be built according to the specifications of the ejs template rendering engine.
  • the html template file is set to:
  • Internationalized files can be set up in a form similar to user data.
  • the code for the internationalized file that conforms to the ejs template rendering template can be repackaged into a json (JavaScript Object Notation, a lightweight data exchange format) file format.
  • the internationalization document includes internationalized copy data in various languages.
  • the different locales may be different, such as a Chinese locale, an English locale, a German locale, etc., in order to facilitate the webpage to be accessed by a browser of a different locale.
  • the corresponding locale's copy can be displayed on the webpage.
  • the application can pre-translate the file into an internationalized copy in a different language environment, and then compile it according to the data format specified by the ejs template rendering engine, and then The compiled internationalized copy data is encapsulated into a json file.
  • the calling template rendering engine includes sub-step 1421 - sub-step 1423:
  • Sub-step 1421 obtaining a locale of the current system
  • the embodiment of the present application first needs to obtain the locale of the current client system. For example, if the current locale of the system is Chinese, you can obtain the locale identifier, such as CN.
  • Sub-step 1422 extracting internationalized copy data corresponding to the locale from the internationalization file
  • the internationalized copy data corresponding to the CN is extracted from the json file.
  • Sub-step 1423 calling a template rendering engine, the html template, user data, and country
  • the analytic copy data is spliced into html code.
  • Sub-step 143 executing the html code, and rendering the sub-interface corresponding to the html code into a specified container.
  • the html code obtained by splicing the template rendering engine executes the code, and then renders according to the html code and renders to the specified container.
  • the specified container is a container obtained by rendering the aforementioned main html document.
  • Step 150 When the dependency of the first script includes multiple levels of style files, the third-party plug-in obtains each level of the style file and renders;
  • the third-party plug-in of requirejs may be loaded into the browser in the first script in advance. Then, if the dependency obtained by the foregoing parsing includes a CSS style file, the third-party plug-in of requirejs can be used to obtain each CSS style file from the server and then render the CSS style file under the folder of the aforementioned path.
  • the step 150 when the level-of-level cascading style files include a cascading style file of the first script and a cascading style file of the at least one second script, the step 150 includes the sub-steps. 151-153:
  • Sub-step 151 acquiring a cascading style file of the first script and a cascading style file of the at least one second script;
  • the third-party plug-in may be first used in the folder of the corresponding directory of the server or listed. CSS file.
  • the CSS file obtained by the logic of avoiding requirejs is directly rendered.
  • the CSS file is obtained from the server in a format that requiresjs cannot be loaded.
  • sub-step 151 includes sub-step A21:
  • Sub-step A21 Acquire a cascading style file of a text type of the cascading style file of the first script.
  • the CSS file of the first script may be obtained from the server by using a text type, and then stored in the memory. At this time, requrejs cannot directly load the CSS file.
  • Sub-step 152 loading and rendering a cascading style file of the at least one second script
  • the second script CSS file is first loaded and rendered.
  • sub-step 152 includes sub-step A31:
  • Sub-step A31 loading and rendering the cascading style file of the at least one second script through a link tag.
  • Sub-step 153 after the cascading style file of the second script is rendered, the cascading style file of the first script is loaded and rendered.
  • the embodiment of the present application loads the CSS file of the first script.
  • sub-step 153 includes sub-step A41:
  • Sub-step A31 after the cascading style file of the second script is finished, the cascading style file of the text type is loaded and rendered by the style tag.
  • the CSS file of the first record style file is temporarily stored in the memory, after the CSS file of the second script is rendered, the CSS file may be extracted from the memory, and then the style tag is used. Load the text type file. In this way, it is guaranteed that the CSS file of the first script can be loaded at the end, and the style of the first script is not overwritten by the style of the second script.
  • Step 160 After all the dependencies of the first script are processed, execute the business logic of the first script.
  • the processing result of the dependency is input as a parameter, and the first script can execute its specific business logic according to the parameter.
  • a corresponding second script, a html (HyperText Mark-up Language) file for each service or function, and a CSS corresponding to each script may be preset for each functional module of the webpage requirement.
  • the definition define each second script, html file and each CSS file that the first script depends on. Then, after obtaining the first script, the client first parses the dependent second script, html file, cascading style sheet file and the like from its dependency definition.
  • the second script is first loaded for loading; for the html file, the html file can be obtained and rendered by the third-party plug-in; for the cascading style file, the third-level plug-in can obtain the style files of each level and Rendering, after all the dependencies of the first script are processed, the client executes the code of the business logic of the first script.
  • the embodiments of the present application have the following advantages:
  • the application divides the functions of the requirements of the webpage into functional modules according to functional modules, and then edits the codes according to the modules, and then stores them in the server.
  • the codes of each module are basically independent of each other, if a certain webpage
  • the module name and directory of the function are defined in the dependency of the first script, and the code of the module can be used.
  • the code reuse rate is high, reducing the amount of code on the web page.
  • the first script since each module is divided according to the function module, in the code of the webpage, the first script relies on the code of each module, and the client can extract the code of the corresponding module according to the definition, and then execute according to the corresponding execution logic, Define global variables for each module in the main html document, the logic of each module can be decoupled, if you want to modify the generation of a function module The code, due to its ability to be decoupled, has a small amount of code for front-end development.
  • FIG. 2 a flow chart of steps of another embodiment of a webpage script loading method of the present application is shown, which may specifically include the following steps:
  • Step 210 Load a first script; the dependencies defined in the dependency definition of the first script include: each second script, an html file, and a hierarchical style file; the html file includes an html template, user data, and internationalization a file; the internationalization file includes internationalized copy file data in various languages; the hierarchical cascading style file includes a cascading style file of the first script and a cascading style file of the at least one second script;
  • the first script A.js is defined in advance, A.js depends on the second script, and the second script includes B.js, C.js, D.js, And rely on html files, html files include html template "html”, user data "data”, international file “international copy”, and rely on CSS files, CSS files include the first script A CSS file A.css, second The CSS file C.css of script C and the CSS file D.css of the second script D.
  • the client After the client obtains the first script A.js, the A.js is loaded in B10 as shown in FIG. 2A.
  • Step 212 Parse the dependency of the first script according to a dependency definition for the first script.
  • the dependency definition is parsed, and the above Lai, namely B.js, C.js, D.js, html template "html", user data "data”, internationalization file “internationalized copy”, A.css, C.css, D.css.
  • the dependency of the A.js is parsed. Then enter B21 for js dependent loading, B22 for html template rendering, and B23 for css rendering.
  • Step 214 Acquire each second script to load
  • the loading process of the A.js dependent js is performed in B21.
  • the embodiment of the present application can separately obtain B.js, C.js, D.js from the server, and then perform recursive loading in B211.
  • the second script may be placed in the role of the first script, first parsing its dependencies, then loading the scripts it depends on, and then recursively loading the same script. Other scripts at the level.
  • B30 is entered.
  • Step 216 Obtain an html template of the text type of the html template, and user data and an internationalization file by using a third-party plug-in of requirejs;
  • the rendering of the html template is performed in B22.
  • the internationalization file may be stored in the form of a json file, and then the path of the json file is specified.
  • the aforementioned directory in the server For example, the aforementioned directory in the server.
  • json files can be maintained in this json file according to different language environments, with language type as the label, and internationalized copy of multiple languages.
  • Step 218 Obtain a locale of the current system.
  • the embodiment of the present application first needs to obtain the locale of the current client system. For example, if the current locale of the system is Chinese, you can obtain the locale identifier, such as CN.
  • Step 220 Extract internationalized copy data corresponding to the locale from the internationalization file
  • the internationalized copy data corresponding to the CN is extracted from the json file.
  • Step 222 the ejs template rendering engine is invoked, and the html template, the user data, and the international copy data are spliced into an html code.
  • the ejs template rendering engine is invoked, the html template "html" of the aforementioned text type is loaded, and then the data and the internationalized copy data corresponding to the CN are spliced to the html template "html", and the output is true.
  • the html code that can be executed normally.
  • Step 224 Execute the html code, and render the sub-interface corresponding to the html code into a specified container.
  • the html code is then executed for corresponding rendering, and the corresponding object is rendered into the specified container as described in the first embodiment.
  • step B30 if it is determined in B222 that the html is finished rendering, the process proceeds to step B30.
  • the step 216-step 224 is the preferred step of the first step of the first embodiment.
  • Step 226 Obtain a cascading style file of a text type of the cascading style file of the first script and a cascading style file of at least one second script by using a third-party plug-in of requirejs;
  • the first script A.js includes a cascading style file A.css
  • the second script C.js includes C.css
  • the second script D.js includes D.css.
  • the second script B.js does not include cascading style files.
  • the file of the A.css text type can be obtained through the third-party plugin of requirejs, and then temporarily stored in the memory in B231.
  • C.css and D.css can be obtained normally.
  • Step 228, loading and rendering a cascading style file of the at least one second script by using a link tag
  • C.css and D.css in Figure 2A are rendered in B232 via the link tag.
  • Step 230 After the cascading style file of the second script is finished, load and render the cascading style file of the text type through the style tag.
  • B233 if it is determined in B233 that C.css and D.css are finished rendering, they are transferred to B234, and A.css is obtained from the memory, and A.css is rendered by the style tag. If it is judged that the A.css is rendered in B235, it will enter B30.
  • step 226 to step 230 are the preferred steps of the first step of the first embodiment.
  • Step 232 After all the dependencies of the first script are processed, execute the business logic of the first script.
  • B21, B22, and B23 may be executed asynchronously, and each part may not be processed at the same time. Then, in Embodiment B30 of the present application, it is determined whether all parts are executed, and if all are completed, then in B40.
  • a corresponding second script, a html (HyperText Mark-up Language) file for each service or function, and a CSS corresponding to each script may be preset for each functional module of the webpage requirement.
  • the definition define each second script, html file and each CSS file that the first script depends on. Then, after obtaining the first script, the client first parses the dependent second script, html file, cascading style sheet file and the like from its dependency definition.
  • the second script is first loaded for loading; for the html file, the html file can be obtained and rendered by the third-party plug-in; for the cascading style file, the third-level plug-in can obtain the style files of each level and Rendering, after all the dependencies of the first script are processed, the client executes the code of the business logic of the first script.
  • the dependencies of each service of the webpage code are clear, the code reusability of each function is strong, the code amount can be reduced, the webpage code structure is clear, the logic of each service can be decoupled, the webpage code can be easily modified, and the business splitting is facilitated. jobs.
  • FIG. 3 a structural block diagram of an embodiment of a webpage script loading apparatus of the present application is shown, which may specifically include the following modules:
  • the first script loading module 310 is configured to load the first script
  • the dependency parsing module 320 is configured to parse the dependency of the first script according to the dependency definition for the first script
  • the second script processing module 330 is configured to: when the dependency of the first script includes each second script, acquire each second script to load;
  • the html file processing module 340 is configured to: when the dependency of the first script includes an html file, acquire the html file by using a third-party plug-in and render the html file;
  • a cascading style file processing module 350 configured to: when the dependency of the first script includes a level-of-featured style file, obtain a level-of-featured file by using a third-party plug-in and render;
  • the first script execution module 360 is configured to execute the business logic of the first script after all the dependencies of the first script are processed.
  • the webpage script loading device is in the client, for example, in a browser, and can acquire corresponding data from the server when executing.
  • the html file includes: an html template, user data, and an internationalization file;
  • the html file processing module 340 then includes:
  • a first obtaining submodule for acquiring an html template, user data, and an internationalization file
  • a splicing sub-module configured to invoke a template rendering engine, and splicing the html template, user data, and internationalization file into an html code;
  • the Html rendering sub-module is configured to execute the html code and render the sub-interface corresponding to the html code into a specified container.
  • the first obtaining submodule includes:
  • the first text file obtaining module is configured to acquire an html template of a text type of the html template.
  • the internationalization file includes internationalized copy data in various languages
  • the splicing submodule includes:
  • the locale acquisition submodule is used to obtain the locale of the current system
  • a copy data extraction module configured to extract internationalized copy data corresponding to the locale from the internationalization file
  • the first splicing sub-module is configured to invoke a template rendering engine to splicing the html template, user data, and international copy data into html code.
  • the level-by-level cascading style files include a cascading style file of the first script and a cascading style file of the at least one second script
  • the cascading style file processing module 350 then includes:
  • a second obtaining submodule configured to acquire a cascading style file of the first script and a cascading style file of the at least one second script
  • a dependent style processing submodule for loading and rendering a cascading style file of the at least one second script
  • the dependency style processing submodule is configured to load and render the cascading style file of the first script after the cascading style file of the second script is finished.
  • the second obtaining submodule includes:
  • a second text file obtaining module configured to acquire a cascading style file of a text type of the cascading style file of the first script.
  • the dependent style processing sub-module includes:
  • the style tag processing submodule is configured to load and render the cascading style file of the text type through the style tag after the cascading style file of the second script is finished.
  • the dependent style processing sub-module includes:
  • the link tag processing module is configured to load and render the cascading style file of the at least one second script by using a link tag.
  • the description is relatively simple, and the relevant parts can be referred to the description of the method embodiment.
  • a corresponding second script, a html (HyperText Mark-up Language) file for each service or function, and a CSS (Cascading Style Sheets) corresponding to each script may be preset in advance for each function of the webpage requirement. Linking a style sheet to a file, and then for a certain business or function of the web page, if it needs a corresponding second script, html file, cascading style sheet, the first definition can be defined in the dependency definition of the corresponding first script.
  • the client can utilize requirejs (RequireJS is a JavaScript module loading framework, which is one of the implementers of the AMD (Asynchronous Module Definition) specification), first from its library. Relying on the second script, html file, cascading style sheet whose definition is resolved, and then acquiring each second script for loading, obtaining the html file through a third-party plug-in and rendering, and obtaining the level by the third-party plug-in
  • the style file is rendered and executed, and after the respective dependencies of the first script are all processed, the business logic of the first script is executed. In this way, the dependencies of the various services of the webpage code are clear, the corresponding webpage code structure is clear, the logic of each business can be decoupled, the amount of code is reduced, the webpage code is conveniently modified, and the business splitting is facilitated.
  • embodiments of the embodiments of the present application can be provided as a method, apparatus, or computer program product. Therefore, the embodiments of the present application may take the form of an entirely hardware embodiment, an entirely software embodiment, or an embodiment combining software and hardware. Moreover, embodiments of the present application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) including computer usable program code.
  • computer-usable storage media including but not limited to disk storage, CD-ROM, optical storage, etc.
  • the computer device includes one or more processors (CPUs), input/output interfaces, network interfaces, and memory.
  • the memory may include non-persistent memory, random access memory (RAM), and/or non-volatile memory in a computer readable medium, such as read only memory (ROM) or flash memory.
  • RAM random access memory
  • ROM read only memory
  • Memory is an example of a computer readable medium.
  • Computer readable media includes both permanent and non-persistent, removable and non-removable media.
  • Information storage can be implemented by any method or technology. The information can be computer readable instructions, data structures, modules of programs, or other data.
  • Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read only memory. (ROM), electrically erasable programmable read only memory (EEPROM), flash memory or other memory technology, compact disk read only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, Magnetic tape cartridges, magnetic tape storage or other magnetic storage devices or any other non-transportable media can be used to store information that can be accessed by a computing device.
  • computer readable media does not include non-persistent computer readable media, such as modulated data signals and carrier waves.
  • Embodiments of the present application are described with reference to flowcharts and/or block diagrams of methods, terminal devices (systems), and computer program products according to embodiments of the present application. It will be understood that each flow and/or block of the flowchart illustrations. Or a combination of processes and/or blocks in a block diagram.
  • These computer program instructions can be provided to a processor of a general purpose computer, special purpose computer, embedded processor or other programmable data processing terminal device to produce a machine such that instructions are executed by a processor of a computer or other programmable data processing terminal device Means are provided for implementing the functions specified in one or more of the flow or in one or more blocks of the flow chart.
  • the computer program instructions can also be stored in a computer readable memory that can direct a computer or other programmable data processing terminal device to operate in a particular manner, such that the instructions stored in the computer readable memory produce an article of manufacture comprising the instruction device.
  • the instruction device implements the functions specified in one or more blocks of the flowchart or in a flow or block of the flowchart.

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Information Transfer Between Computers (AREA)
  • Document Processing Apparatus (AREA)
  • Stored Programmes (AREA)

Abstract

一种网页脚本加载方法和一种网页脚本加载装置。所述方法包括：加载第一脚本（110）；根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖（120）；当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载（130）；当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染（140）；当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染（150）；在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑（160）。所述方法的网页代码的各个业务的依赖关系明晰，各个功能的代码复用性强，代码量能够降低，网页代码结构清晰，各业务的逻辑能够解耦，方便修改网页代码，方便进行业务拆分等工作。

Description

一种网页脚本加载方法和装置 技术领域
本申请涉及网页技术领域，特别是涉及一种网页脚本加载方法和一种网页脚本加载装置。
背景技术
随着互联网的发展，网页的业务也越来越多。而在先技术中，前端在开发网页代码时，如果该网页有新的业务需求后，则根据需求在网页代码中添加新的业务代码，随着业务的变更和增加，该网页代码比较散比较杂。
其中，在网页开发中的前端：通常是针对浏览器等客户端程序而开发的，是在浏览器端运行的程序；前端是在Web应用中用户可以看得见碰得着的东西，包括Web页面的结构、Web页面的外观视觉表现以及Web页面的交互实现。相应的，后端：针对的是服务器，准确的来说应该是针对服务器端开发的，在服务器中运行的是提供数据的程序；后端更多的是与数据库进行交互以处理相应的业务逻辑，需要考虑的是如何实现功能、数据的存取、平台的稳定性与性能等。
在上述情况中，如果某些业务存在重合的功能时，需要在各个业务代码中对该功能重复编写相应代码，代码复用性差、代码量大；并且上述散乱的代码可能导致业务的逻辑耦合，导致对某个业务修改时，由于逻辑耦合，需要修改大量相关的其他业务的代码；再者，如果要对该网页进行业务拆分，由于代码散乱和逻辑耦合，也很难拆分。
发明内容
鉴于上述问题，提出了本申请实施例以便提供一种克服上述问题或者至少部分地解决上述问题的一种网页脚本加载方法和相应的一种网页脚本加载装置。
为了解决上述问题，本申请公开了一种网页脚本加载方法，包括：
加载第一脚本；
根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载；
当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染；
当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染；
在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
本申请还公开了一种网页脚本加载装置，包括：
第一脚本加载模块，用于加载第一脚本；
依赖解析模块，用于根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
第二脚本处理模块，用于当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载；
html文件处理模块，用于当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染；
级联样式文件处理模块，用于当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染；
第一脚本执行模块，用于在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
本申请实施例包括以下优点：
本申请实施例，可以针对网页需求的各个功能模块，预先设置相应 的第二脚本，各业务或者功能的html(HyperText Mark-up Language，超文本标记语言)文件，各个脚本对应的CSS(Cascading Style Sheets，级联样式表)文件，然后对于网页的某个业务或者功能，如果其需要相应的第二脚本、html文件、级联样式表，则可以在该业务或功能相应的第一脚本的依赖定义中，定义该第一脚本所依赖的各个第二脚本，html文件和各CSS文件。那么客户端在获取到该第一脚本后，首先从其依赖定义中解析出其依赖的第二脚本、html文件、级联样式表文件等依赖。对于第二脚本，然后先获取各第二脚本进行加载；对于html文件，可通过第三方插件获取所述html文件并渲染；对于级联样式文件，可通过第三方插件获取各级联样式文件并渲染，在所述第一脚本的各依赖全部处理完毕后，客户端再执行所述第一脚本的业务逻辑的代码。如此，网页代码的各个业务的依赖关系明晰，各个功能的代码复用性强，代码量能够降低，网页代码结构清晰，各业务的逻辑能够解耦，方便修改网页代码，方便进行业务拆分等工作。
附图说明
图1是本申请的一种网页脚本加载方法实施例的步骤流程图；
图2是本申请的另一种网页脚本加载方法实施例的步骤流程图；
图2A是本申请的一种网页脚本加载方法的逻辑示例图；
图3是本申请的一种网页脚本加载装置实施例的结构框图。
具体实施方式
为使本申请的上述目的、特征和优点能够更加明显易懂，下面结合附图和具体实施方式对本申请作进一步详细的说明。
本申请实施例的核心构思之一在于，可以对各个网页需求的各个功能模块，预先设置相应的第二脚本，各业务或者功能的html(HyperText Mark-up Language，超文本标记语言)文件，各个脚本对应的CSS(Cascading Style Sheets，级联样式表)文件，然后对于某个网页，其某个业务或者功能，如果其需要相应的第二脚本、html文件、级联样式 表，则可以在相应的第一脚本的依赖定义中，定义该第一脚本所依赖的各个第二脚本，html文件和各css文件。那么客户端在获取到该第一脚本后，可以利用requirejs(requirejs是一个JavaScript模块载入框架，是AMD(Asynchronous Module Definition，异步模块加载机制)规范的实现者之一)等库，首先从其依赖定义中获解析出其依赖的第二脚本、html文件、级联样式文件。对于html文件，可通过第三方插件获取所述html文件并渲染；对于级联样式文件，可通过第三方插件获取各级联样式文件并渲染，在所述第一脚本的各依赖全部处理完毕后，客户端再执行所述第一脚本的业务逻辑的代码。如此，网页代码的各个业务的依赖关系明晰，各个功能的代码复用性强，代码量能够降低，网页代码结构清晰，各业务的逻辑能够解耦，方便修改网页代码，方便进行业务拆分等工作。
实施例一
参照图1，示出了本申请的一种网页脚本加载方法实施例的步骤流程图，具体可以包括如下步骤：
步骤110，加载第一脚本；
在本申请实施例中，在前端构建网页时，可以在网页的主html文档的html代码中预置加载第一脚本的加载接口。比如在html代码的<script>中添加上述加载接口。
比如采用requirejs库的加载接口，其加载接口示例如下：<script data-main＝"main"src＝"require.js"></script>。其中src＝"require.js"，表示第一脚本的在服务器的路径，data-main＝"main"表示第一脚本的主函数。
当然，实际应用中，第一脚本的加载接口也可以在其他位置添加，本申请实施例不对其加以限制。
在本申请实施例中，在该网页代码中可以添加一个第一脚本的加载接口，也可以添加多个第一脚本的加载接口，本申请实施例不对其加以限制。当然，如果有多个第一脚本的加载接口，各个第一脚本的业务逻辑不同。
在本发明实施例中，当客户端获取到主html文档后，解析其中的html代码，当解析到上述第一脚本的加载接口，则从服务器中获取相应的第一脚本，然后加载该第一脚本。
在本申请实施例中，在第一脚本中，预先设置了依赖定义，比如在第一脚本的主函数中定义了第一脚本依赖的各第二脚本、html文件、CSS文件其中一个或者多个。然后在服务器的相应路径的文件夹下，放入依赖的各第二脚本、和/或html文件、和/或CSS文件。
可以理解，在实际应用中，当客户端获取到主html文档后，解析其他的html代码，还可能解析其他的部分，比如该html代码中的其他标签。本申请实施例不对其加以限制。
当然本申请还可以采用其他库的加载接口，本申请实施例不对其加以限制。
可以理解，该客户端可以为浏览器、也可以为其他能够处理html代码的程序或者应用。其中该浏览器可以为个人电脑浏览器、也可以为智能移动终端的浏览器。本申请实施例不对其加以限制。
步骤120，根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
由于本申请预先为第一脚本设置了依赖定义，那么在加载该第一脚本后，则首先从该第一脚本的依赖定义中，解析该第一脚本的依赖。
在实际应用中，由于服务器侧的技术开发人员，可以根据业务需求的第二脚本、和/或html文件、和/或CSS文件，该第一脚本的依赖定义中写入需求的第二脚本、和/或html文件、和/或CSS文件。那么本申请实施例中，在解析该第一脚本的依赖时可能存在多种情况，如：
1、只依赖第二脚本。
2、只依赖html文件。
3、只依赖CSS文件。
该种情况下，该CSS文件可以是针对第一脚本的CSS文件。
4、依赖各第二脚本和html文件。
5、依赖第二脚本和CSS文件；
该种情况下，如果有多个CSS文件，该多个CSS文件可能是针对第一脚本和第二脚本中的某些个脚本的CSS文件。
6、依赖html文件、和CSS文件；
该种情况下，该CSS文件可以是针对第一脚本的CSS文件。
7、依赖第二脚本、html文件、CSS文件。
该种情况下，如果有多个CSS文件，该多个CSS文件可能是针对第一脚本和第二脚本中的某些个脚本的CSS文件。
那么本申请实施例，在解析第一脚本的依赖，根据预先设置的情况，可能解析到上述几种情况。
步骤130，当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载；
在本申请实施例中，如果前述解析得到的依赖包括各第二脚本，则在前述的路径的文件夹下，从服务器获取各第二脚本，然后可以加载各第二脚本。
在本申请实施例中，当第一脚本依赖的某个或者某几个第二脚本，该第二脚本也可作为第一脚本的身份，那么在加载该第一脚本后，执行步骤120-160。
步骤140，当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染；
在本申请实施例中，可以在客户端访问网页时或者之前为客户端加载requirejs的第三方插件。那么如果前述解析得到的依赖包括html文件，则可以通过requirejs的第三方插件在前述的路径的文件夹下，从服务器获取 各html文件，然后即可基于该html文件进行渲染。
在本申请实施例中，该html文件渲染后对应前述主html文档的网页的子界面。
在本申请另一优选的实施例中，所述html文件包括html模板、用户数据、国际化文件。
其中用户数据包括用户个性化信息等业务数据。国际化文件包国际化文案数据。html模板为预定的各种页面模板，该html模板包括至少多个填入数据的字段，如填入用户各种个性化信息的字段和填入国际化文案数据的字段。
进一步的，步骤140包括子步骤141-143：
子步骤141，获取html模板、用户数据和国际化文件；
在本申请实施例中，第一脚本依赖的html文件包括了html模板、用户数据和国际化文件。本申请可以获取html模板、用户数据和国际化文件。
在本申请另一优选的实施例中，子步骤141包括子步骤A11：
子步骤A11，获取所述html模板的text类型的html模板。
requirejs的第三方插件以text文件类型，从服务器或html模板文件，然后存储到内存中。
该种方式可以避免客户端(如浏览器)直接获取到html模板的代码，然后直接解析并渲染了该html模板的代码，导致渲染得到的网页中没有实际的数据展示。
子步骤142，调用模板渲染引擎，将所述html模板、用户数据和国际化文件拼接为html代码；
本申请实施例则可以调用模板渲染引擎，将用户数据和国际化文件填入html模板中，得到html代码。
在本申请实施例中该模板渲染引擎可以为ejs(EJS是Canjs的默认的 模版语言)模板渲染引擎。
在本申请实施例中，以ejs模板渲染引擎为例，可以预先构建一个ejs模板渲染引擎。并且在第一脚本依赖的html文件的代码中，添加<script>标签，然后在该<script>标签引用ejs模板渲染引擎如：<script type＝"text/javascript"src＝"/js/ejs.js"></script>。那么浏览器获取到主html文档后，执行到该<script>……</script>代码，则会获取ejs引擎的脚本，然后加载。
而html模板文件、用户数据、国际化文件可按照ejs模板渲染引擎的规定构建。比如html模板文件设置为：
Figure PCTCN2017070890-appb-000001
Figure PCTCN2017070890-appb-000002
国际化文件可以采用类似用户数据的形式设置。当然实际应用中，对于国际化文件的符合ejs模板渲染模板的规定的代码，可以将其再封装为json(JavaScript Object Notation，是一种轻量级的数据交换格式)文件格式。
在本申请另一优选的实施例中，上述国际化文件包括各种语言的国际化文案数据。
在本申请实施例中，对于某个的文案，由于存在不同的语言环境可能不同，比如中文语言环境，英文语言环境，德语语言环境等等，为了方便网页可以被不同语言环境的浏览器访问该网页时，可以在该网页中展示相应语言环境的文案，本申请可以将该文件预先翻译成不同语言环境下的国际化文案，然后将其按ejs模板渲染引擎规定的数据格式编译好，再将编译好的各个国际化文案数据封装到一份json文件中。
则进一步的，所述调用模板渲染引擎，将所述html模板、用户数据和国际化文件拼接为html代码的步骤，包括子步骤1421-子步骤1423：
子步骤1421，获取当前系统的语言环境；
由于国际化文案的json文件中包括了多种语言的国际化文案，而为了适配用户的客户端的语言环境，方便用户阅读网页，本申请实施例首先需要获取当前客户端所在系统的语言环境。比如当前系统的语言环境为中文，则可以获取其语言环境标识，如CN。
子步骤1422，从所述国际化文件中提取对应所述语言环境的国际化文案数据；
那么根据CN，从json文件中提取CN对应的国际化文案数据。
子步骤1423，调用模板渲染引擎，将所述html模板、用户数据和国 际化文案数据拼接为html代码。
然后调用ejs模板渲染引擎，提取前述暂存的html模板“html”，然后将data、CN对应的国际化文案数据拼接到该html模板“html”，得到真正的可正常执行的html代码。
子步骤143，执行所述html代码，并将所述html代码对应的子界面渲染到指定容器中。
对模板渲染引擎拼接得到的html代码，则执行该代码，则会根据该html代码进行渲染，渲染到指定容器。该指定容器为前述主html文档渲染后得到的容器。
步骤150，当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染；
在本申请实施例中，可以预先在第一脚本中为浏览器加载requirejs的第三方插件。那么如果前述解析得到的依赖包括CSS样式文件，则可以通过requirejs的第三方插件在前述的路径的文件夹下，从服务器获取各CSS样式文件然后对该CSS样式文件进行渲染。
在本申请另一优选的实施例中，当所述各级级联样式文件包括第一脚本的级联样式文件和至少一个第二脚本的级联样式文件时，则所述步骤150包括子步骤151-153：
子步骤151，获取第一脚本的级联样式文件和至少一个第二脚本的级联样式文件；
在本申请实施例中，如果第一脚本包括CSS脚本，以及其依赖的第二脚本中的一个或者多个包括CSS文件，则可以先通过前述第三方插件从服务器相应目录的文件夹中或上市CSS文件。
在本申请实施例中，对避免requirejs的逻辑将获取到的CSS文件直接渲染，本申请实施例则以requirejs不能加载的格式从服务器获取CSS文件。
在本申请另一优选的实施例中，子步骤151包括子步骤A21：
子步骤A21，获取所述第一脚本的级联样式文件的text类型的级联样式文件。
在本申请实施例中，可以采用text类型的方式从服务器获取第一脚本的CSS文件，然后存储到内存中，此时requrejs则无法直接加载该CSS文件。
子步骤152，加载并渲染所述至少一个第二脚本的级联样式文件；
在本申请实施例中，在首先加载并渲染第二脚本CSS文件。
在本申请另一优选的实施例中，子步骤152包括子步骤A31：
子步骤A31，通过link标签加载并渲染所述至少一个第二脚本的级联样式文件。
在实际应用中，对于每个第二脚本的CSS文件，将其加入link标签，然后requirejs就可以link标签直接加载并渲染该link对应的CSS文件。
子步骤153，在第二脚本的级联样式文件渲染完毕之后，再加载并渲染第一脚本的级联样式文件。
在所有第二脚本的CSS文件渲染完毕之后，本申请实施例才会加载第一脚本的CSS文件。
在本申请另一优选的实施例中，子步骤153包括子步骤A41：
子步骤A31，在第二脚本的级联样式文件渲染完毕之后，通过style标签加载并渲染所述text类型的级联样式文件。
在本申请实施例中，由于前述第一记录样式文件的CSS文件暂存到内存中了，那么在第二脚本的CSS文件渲染完毕之后，则可以从内存中提取该CSS文件，然后以style标签加载该text类型文件。如此，保证了第一脚本的CSS文件可以在最后加载，第一脚本的样式不会被第二脚本的样式覆盖。
当然，在本申请实施例中，如果第一脚本没有CSS文件，对于各第二 脚本的CSS样式，可以采用link标签直接加载。
步骤160，在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
在本申请实施例中，在前述第一脚本的全部依赖处理完毕后，上述依赖的处理结果作为参数输入第一脚本，第一脚本则可以根据该参数执行其具体的业务逻辑。
本申请实施例，可以针对网页需求的各个功能模块，预先设置相应的第二脚本，各业务或者功能的html(HyperText Mark-up Language，超文本标记语言)文件，各个脚本对应的CSS(Cascading Style Sheets，级联样式表)文件，然后对于网页的某个业务或者功能，如果其需要相应的第二脚本、html文件、级联样式表，则可以在该业务或功能相应的第一脚本的依赖定义中，定义该第一脚本所依赖的各个第二脚本，html文件和各CSS文件。那么客户端在获取到该第一脚本后，首先从其依赖定义中获解析出其依赖的第二脚本、html文件、级联样式表文件等依赖。对于第二脚本，然后先获取各第二脚本进行加载；对于html文件，可通过第三方插件获取所述html文件并渲染；对于级联样式文件，可通过第三方插件获取各级联样式文件并渲染，在所述第一脚本的各依赖全部处理完毕后，客户端再执行所述第一脚本的业务逻辑的代码。如此，本申请实施例具备以下优点：
其一，本申请将网页的需求的各个功能，按照功能模块划分为各个模块，然后按照模块编辑代码，然后存储到服务器中，每个模块的代码基本上相互独立，如果某个网页的某个第一脚本需要某个功能时，则在第一脚本的依赖中定义该功能的模块名称和目录，即可使用该模块的代码。如此，对于前端开发来说，代码的复用率高，减少了网页的代码量。
其二，由于按照功能模块划分各个模块，在网页的代码中，采用第一脚本依赖各个模块的代码的方式，而客户端可以根据定义提取相应模块的代码，然后根据相应的执行逻辑执行，不用在主html文档中为各个模块定义全局变量，各个模块的逻辑可以解耦，如果要修改一个功能的模块的代 码，由于能够解耦，对于前端开发来说，修改的代码量小。
其三，基于上述过程，网页代码的结构清晰，各业务的逻辑能够解耦，方便进行业务拆分等工作。
。
实施例二
参照图2，示出了本申请的另一种网页脚本加载方法实施例的步骤流程图，具体可以包括如下步骤：
步骤210，加载第一脚本；所述第一脚本的依赖定义中所定义的依赖包括：各第二脚本、html文件、各级联样式文件；所述html文件包括html模板、用户数据、国际化文件；所述国际化文件包括各种语言的国际化文案数据；所述各级级联样式文件包括第一脚本的级联样式文件和至少一个第二脚本的级联样式文件；
本申请实施例结合图2A进行描述，图2A的示例中，预先定义了第一脚本A.js，A.js依赖第二脚本，第二脚本包括B.js、C.js、D.js，以及依赖html文件，html文件包括html模板“html”、用户数据“data”、国际化文件“国际化文案”，以及依赖CSS文件，CSS文件包括第一脚本A的CSS文件A.css、第二脚本C的CSS文件C.css、第二脚本D的CSS文件D.css。
上述A.js、B.js、C.js、D.js、html模板“html”、用户数据“data”、国际化文件“国际化文案”、A.css、C.css、D.css可以放到服务器的指定目录的某个文件夹中。
当然，在第一脚本的依赖定义中，还可配置各依赖在服务器中的路径，如前述的指定目录的文件夹中的各依赖。
客户端在获取到第一脚本A.js后，如图2A在B10中加载该A.js。
步骤212，根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
在本申请实施例中加载了A.js后，解析其依赖定义，则解析上述的依 赖，即B.js、C.js、D.js、html模板“html”、用户数据“data”、国际化文件“国际化文案”、A.css、C.css、D.css。如图2A的B20，其在A.js加载之后，解析该A.js的依赖。然后分别进入B21进行js依赖加载、B22进行html模板渲染、B23进行css渲染。
步骤214、获取各第二脚本进行加载；
如图2A中，在B21中执行A.js依赖的js的加载过程。
那么本申请实施例可以从服务器分别获取B.js、C.js、D.js，然后在B211中进行递归加载。在本申请实施例中，如果第二脚本还依赖更深层级的脚本，则可以将该第二脚本放在第一脚本的角色，先解析其依赖，然后加载其依赖的脚本，然后递归加载其同级的其他脚本。
如图2A中，如果在B212中判断B.js、C.js、D.js都加载完毕，则进入B30。
步骤216，通过requirejs的第三方插件获取所述html模板的text类型的html模板，以及用户数据、国际化文件；
如图2A中，在B22中执行html模板的渲染。
在本申请实施例中对于html模板“html”，则获取“html”的text类型的文件，用户数据“data”、国际化文件“国际化文案”。
在本申请实施例中，国际化文件可以采用json文件的形式进行存储，然后指定该json文件的路径。比如前述在服务器中的目录。在实际应用中，json文件中，可以根据不同的语言环境，以语言类型为标示，将多种语言的国际化文案维护在这份json文件中。
步骤218，获取当前系统的语言环境；
由于国际化文案的json文件中包括了多种语言的国际化文案，而为了适配用户的客户端的语言环境，方便用户阅读网页，本申请实施例首先需要获取当前客户端所在系统的语言环境。比如当前系统的语言环境为中文，则可以获取其语言环境标识，如CN。
步骤220，从所述国际化文件中提取对应所述语言环境的国际化文案数据；
那么根据CN，从json文件中提取CN对应的国际化文案数据。
步骤222，调用ejs模板渲染引擎，将所述html模板、用户数据和国际化文案数据拼接为html代码；
如图2A中，在B221中，调用ejs模板渲染引擎，载入前述text类型的html模板“html”，然后将data以及前述CN对应的国际化文案数据拼接到该html模板“html”，输出真正的可正常执行的html代码。
步骤224，执行所述html代码，并将所述html代码对应的子界面渲染到指定容器中。
然后执行该html代码进行相应的渲染，将相应的对象渲染到实施例一所述的指定容器中。
如图2A如果在B222中判断html完成渲染，则进入步骤B30。
其中，所述步骤216-步骤224为实施例一步骤140优选的步骤。
步骤226，通过requirejs的第三方插件获取所述第一脚本的级联样式文件的text类型的级联样式文件和至少一个第二脚本的级联样式文件；
如图前述例子，第一脚本A.js包括级联样式文件A.css，第二脚本C.js包括C.css，第二脚本D.js包括D.css。第二脚本B.js不包括级联样式文件。
那么如图2A，对于A.css，可以通过requirejs的第三方插件获取该A.css的text类型的文件，然后在B231中将其暂存至内存中。同时，可以正常获取C.css和D.css。
步骤228，通过link标签加载并渲染所述至少一个第二脚本的级联样式文件；
对于图2A中的C.css和D.css，在B232中通过link标签渲染C.css和D.css。
步骤230，在第二脚本的级联样式文件渲染完毕之后，通过style标签加载并渲染所述text类型的级联样式文件。
如图2A，在B233中如果判断C.css和D.css完成渲染，则转入B234中，从内存中获取A.css，利用style标签渲染A.css。在B235中如果判断A.css渲染完毕，则进入B30。
其中，所述步骤226-步骤230为实施例一步骤150优选的步骤。
步骤232，在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
如图2A，在实际应用中，B21、B22、B23可以是异步执行，各部分可以不是同一时刻处理完毕，那么本申请实施例B30判断各部分是否都执行完毕，如果都执行完毕，则在B40中执行A.js的业务逻辑的代码。B40执行完毕后，用户可在浏览器侧的在页面中操作A.js相关功能。
本申请实施例，可以针对网页需求的各个功能模块，预先设置相应的第二脚本，各业务或者功能的html(HyperText Mark-up Language，超文本标记语言)文件，各个脚本对应的CSS(Cascading Style Sheets，级联样式表)文件，然后对于网页的某个业务或者功能，如果其需要相应的第二脚本、html文件、级联样式表，则可以在该业务或功能相应的第一脚本的依赖定义中，定义该第一脚本所依赖的各个第二脚本，html文件和各CSS文件。那么客户端在获取到该第一脚本后，首先从其依赖定义中获解析出其依赖的第二脚本、html文件、级联样式表文件等依赖。对于第二脚本，然后先获取各第二脚本进行加载；对于html文件，可通过第三方插件获取所述html文件并渲染；对于级联样式文件，可通过第三方插件获取各级联样式文件并渲染，在所述第一脚本的各依赖全部处理完毕后，客户端再执行所述第一脚本的业务逻辑的代码。如此，网页代码的各个业务的依赖关系明晰，各个功能的代码复用性强，代码量能够降低，网页代码结构清晰，各业务的逻辑能够解耦，方便修改网页代码，方便进行业务拆分等工作。
需要说明的是，对于方法实施例，为了简单描述，故将其都表述为一 系列的动作组合，但是本领域技术人员应该知悉，本申请实施例并不受所描述的动作顺序的限制，因为依据本申请实施例，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作并不一定是本申请实施例所必须的。
实施例三
参照图3，示出了本申请的一种网页脚本加载装置实施例的结构框图，具体可以包括如下模块：
第一脚本加载模块310，用于加载第一脚本；
依赖解析模块320，用于根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
第二脚本处理模块330，用于当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载；
html文件处理模块340，用于当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染；
级联样式文件处理模块350，用于当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染；
第一脚本执行模块360，用于在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
在本申请实施例中，该网页脚本加载装置处于客户端中，比如处于浏览器中，执行时可以从服务器获取相应数据。
在本申请一优选的实施例中，所述html文件包括：html模板、用户数据、国际化文件；
则所述html文件处理模块340包括：
第一获取子模块，用于获取html模板、用户数据和国际化文件；
拼接子模块，用于调用模板渲染引擎，将所述html模板、用户数据和国际化文件拼接为html代码；
Html渲染子模块，用于执行所述html代码，并将所述html代码对应的子界面渲染到指定容器中。
在本申请一优选的实施例中，，所述第一获取子模块包括：
第一text文件获取模块，用于获取所述html模板的text类型的html模板。
在本申请一优选的实施例中，，所述国际化文件包括各种语言的国际化文案数据；
所述拼接子模块包括：
语言环境获取子模块，用于获取当前系统的语言环境；
文案数据提取模块，用于从所述国际化文件中提取对应所述语言环境的国际化文案数据；
第一拼接子模块，用于调用模板渲染引擎，将所述html模板、用户数据和国际化文案数据拼接为html代码。
在本申请一优选的实施例中，当所述各级级联样式文件包括第一脚本的级联样式文件和至少一个第二脚本的级联样式文件时，
则所述级联样式文件处理模块350包括：
第二获取子模块，用于获取第一脚本的级联样式文件和至少一个第二脚本的级联样式文件；
被依赖样式处理子模块，用于加载并渲染所述至少一个第二脚本的级联样式文件；
依赖样式处理子模块，用于在第二脚本的级联样式文件渲染完毕之后，再加载并渲染第一脚本的级联样式文件。
在本申请一优选的实施例中，所述第二获取子模块包括：
第二text文件获取模块，用于获取所述第一脚本的级联样式文件的text类型的级联样式文件。
在本申请一优选的实施例中，所述依赖样式处理子模块包括：
style标签处理子模块，用于在第二脚本的级联样式文件渲染完毕之后，通过style标签加载并渲染所述text类型的级联样式文件。
在本申请一优选的实施例中，所述被依赖样式处理子模块包括：
link标签处理模块，用于通过link标签加载并渲染所述至少一个第二脚本的级联样式文件。
对于装置实施例而言，由于其与方法实施例基本相似，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。
本申请实施例可以对网页需求的各个功能预先设置相应的第二脚本，各业务或者功能的html(HyperText Mark-up Language，超文本标记语言)文件，各个脚本对应的CSS(Cascading Style Sheets，级联样式表)文件，然后对于网页的某个业务或者功能，如果其需要相应的第二脚本、html文件、级联样式表，则可以在相应的第一脚本的依赖定义中，定义该第一脚本所依赖的各个第二脚本，html文件和各css文件。那么客户端在获取到该第一脚本后，可以利用requirejs(RequireJS是一个JavaScript模块载入框架，是AMD(Asynchronous Module Definition，异步模块加载机制)规范的实现者之一)等库，首先从其依赖定义中获解析出其依赖的第二脚本、html文件、级联样式表，然后获取各第二脚本进行加载，通过第三方插件获取所述html文件并渲染，通过第三方插件获取各级联样式文件并渲染，在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。如此，网页代码的各个业务的依赖关系明晰，相应的网页代码结构清晰，各业务的逻辑能够解耦，代码量减少，方便修改网页代码，方便进行业务拆分等工作。
本说明书中的各个实施例均采用递进的方式描述，每个实施例重点说明的都是与其他实施例的不同之处，各个实施例之间相同相似的部分互相参见即可。
本领域内的技术人员应明白，本申请实施例的实施例可提供为方法、装置、或计算机程序产品。因此，本申请实施例可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请实施例可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
在一个典型的配置中，所述计算机设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括非持续性的电脑可读媒体(transitory media)，如调制的数据信号和载波。
本申请实施例是参照根据本申请实施例的方法、终端设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/ 或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理终端设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理终端设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理终端设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理终端设备上，使得在计算机或其他可编程终端设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程终端设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
尽管已描述了本申请实施例的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例做出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本申请实施例范围的所有变更和修改。
最后，还需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者终端设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者终端设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者终端设备中还存在另外的相同要素。
以上对本申请所提供的一种网页脚本加载方法和一种网页脚本加载装置，进行了详细介绍，本文中应用了具体个例对本申请的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本申请的方法及其核心思想；同时，对于本领域的一般技术人员，依据本申请的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本申请的限制。

Claims (16)

  1. 一种网页脚本加载方法，其特征在于，包括：
    加载第一脚本；
    根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
    当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载；
    当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染；
    当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染；
    在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
  2. 根据权利要求1所述的方法，其特征在于，所述html文件包括：html模板、用户数据、国际化文件；
    则所述通过第三方插件获取所述html文件并渲染的步骤，包括：
    获取html模板、用户数据和国际化文件；
    调用模板渲染引擎，将所述html模板、用户数据和国际化文件拼接为html代码；
    执行所述html代码，并将所述html代码对应的子界面渲染到指定容器中。
  3. 根据权利要求2所述的方法，其特征在于，所述获取html模板的步骤，包括：
    获取所述html模板的text类型的html模板。
  4. 根据权利要求2或3所述的方法，其特征在于，所述国际化文件 包括各种语言的国际化文案数据；
    则所述调用模板渲染引擎，将所述html模板、用户数据和国际化文件拼接为html代码的步骤，包括：
    获取当前系统的语言环境；
    从所述国际化文件中提取对应所述语言环境的国际化文案数据；
    调用模板渲染引擎，将所述html模板、用户数据和国际化文案数据拼接为html代码。
  5. 根据权利要求1所述的方法，其特征在于，当所述各级级联样式文件包括第一脚本的级联样式文件和至少一个第二脚本的级联样式文件时，
    则所述通过第三方插件获取各级联样式文件并渲染的步骤，包括：
    获取第一脚本的级联样式文件和至少一个第二脚本的级联样式文件；
    加载并渲染所述至少一个第二脚本的级联样式文件；
    在第二脚本的级联样式文件渲染完毕之后，再加载并渲染第一脚本的级联样式文件。
  6. 根据权利要求5所述的方法，其特征在于，所述获取第一脚本的级联样式文件的步骤，包括：
    获取所述第一脚本的级联样式文件的text类型的级联样式文件。
  7. 根据权利要求6所述的方法，其特征在于，所述在第二脚本的级联样式文件渲染完毕之后，再加载并渲染第一脚本的级联样式文件的步骤，包括：
    在第二脚本的级联样式文件渲染完毕之后，通过style标签加载并渲染所述text类型的级联样式文件。
  8. 根据权利要求6所述的方法，其特征在于，所述加载并渲染所述 至少一个第二脚本的级联样式文件的步骤，包括：
    通过link标签加载并渲染所述至少一个第二脚本的级联样式文件。
  9. 一种网页脚本加载装置，其特征在于，包括：
    第一脚本加载模块，用于加载第一脚本；
    依赖解析模块，用于根据针对所述第一脚本的依赖定义，解析所述第一脚本的依赖；
    第二脚本处理模块，用于当所述第一脚本的依赖包括各第二脚本，则获取各第二脚本进行加载；
    html文件处理模块，用于当所述第一脚本的依赖包括html文件，则通过第三方插件获取所述html文件并渲染；
    级联样式文件处理模块，用于当所述第一脚本的依赖包括各级联样式文件，则通过第三方插件获取各级联样式文件并渲染；
    第一脚本执行模块，用于在所述第一脚本的各依赖全部处理完毕后，执行所述第一脚本的业务逻辑。
  10. 根据权利要求9所述的装置，其特征在于，所述html文件包括：html模板、用户数据、国际化文件；
    则所述html文件处理模块包括：
    第一获取子模块，用于获取html模板、用户数据和国际化文件；
    拼接子模块，用于调用模板渲染引擎，将所述html模板、用户数据和国际化文件拼接为html代码；
    Html渲染子模块，用于执行所述html代码，并将所述html代码对应的子界面渲染到指定容器中。
  11. 根据权利要求10所述的装置，其特征在于，所述第一获取子模块包括：
    第一text文件获取模块，用于获取所述html模板的text类型的html模板。
  12. 根据权利要求10所述的装置，其特征在于，所述国际化文件包括各种语言的国际化文案数据；
    所述拼接子模块包括：
    语言环境获取子模块，用于获取当前系统的语言环境；
    文案数据提取模块，用于从所述国际化文件中提取对应所述语言环境的国际化文案数据；
    第一拼接子模块，用于调用模板渲染引擎，将所述html模板、用户数据和国际化文案数据拼接为html代码。
  13. 根据权利要求10所述的装置，其特征在于，当所述各级级联样式文件包括第一脚本的级联样式文件和至少一个第二脚本的级联样式文件时，
    则所述级联样式文件处理模块包括：
    第二获取子模块，用于获取第一脚本的级联样式文件和至少一个第二脚本的级联样式文件；
    被依赖样式处理子模块，用于加载并渲染所述至少一个第二脚本的级联样式文件；
    依赖样式处理子模块，用于在第二脚本的级联样式文件渲染完毕之后，再加载并渲染第一脚本的级联样式文件。
  14. 根据权利要求13所述的装置，其特征在于，所述第二获取子模块包括：
    第二text文件获取模块，用于获取所述第一脚本的级联样式文件的text类型的级联样式文件。
  15. 根据权利要求14所述的装置，其特征在于，所述依赖样式处理 子模块包括：
    style标签处理子模块，用于在第二脚本的级联样式文件渲染完毕之后，通过style标签加载并渲染所述text类型的级联样式文件。
  16. 根据权利要求14所述的装置，其特征在于，所述被依赖样式处理子模块包括：
    link标签处理模块，用于通过link标签加载并渲染所述至少一个第二脚本的级联样式文件。
PCT/CN2017/070890 2016-01-21 2017-01-11 一种网页脚本加载方法和装置 Ceased WO2017124952A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201610041684.9A CN106990976A (zh) 2016-01-21 2016-01-21 一种网页脚本加载方法和装置
CN201610041684.9 2016-01-21

Publications (1)

Publication Number Publication Date
WO2017124952A1 true WO2017124952A1 (zh) 2017-07-27

Family

ID=59361441

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2017/070890 Ceased WO2017124952A1 (zh) 2016-01-21 2017-01-11 一种网页脚本加载方法和装置

Country Status (3)

Country Link
CN (1) CN106990976A (zh)
TW (1) TW201732647A (zh)
WO (1) WO2017124952A1 (zh)

Cited By (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110825373A (zh) * 2019-10-10 2020-02-21 上海上湖信息技术有限公司 一种移动端动态化方法及装置
CN111124482A (zh) * 2019-12-25 2020-05-08 北京达佳互联信息技术有限公司 文案信息的配置方法和装置
CN111273909A (zh) * 2018-12-04 2020-06-12 北京京东尚科信息技术有限公司 应用程序管理方法和装置
CN111679825A (zh) * 2020-04-24 2020-09-18 平安国际智慧城市科技股份有限公司 一种层叠样式表生成方法、装置、计算机设备及存储介质
CN112181374A (zh) * 2020-09-25 2021-01-05 广州力挚网络科技有限公司 一种数据整合方法、装置、电子设备及存储介质
CN112416311A (zh) * 2019-08-22 2021-02-26 北京国双科技有限公司 数据处理方法和装置、存储介质及处理器
CN112540745A (zh) * 2019-09-20 2021-03-23 北京国双科技有限公司 一种组件渲染方法及装置
CN112800724A (zh) * 2020-12-29 2021-05-14 杭州涂鸦信息技术有限公司 可视化配置模板的可读文件导出方法及相关装置
CN113626014A (zh) * 2021-08-09 2021-11-09 宝宝巴士股份有限公司 一种基于Xcode的插件实现方法
CN113918173A (zh) * 2021-10-26 2022-01-11 杭州安恒信息技术股份有限公司 一种模板渲染方法、模板渲染系统、存储介质和渲染设备
CN114238819A (zh) * 2021-12-22 2022-03-25 北京升明科技有限公司 网页渲染方法及装置
CN114637548A (zh) * 2022-02-18 2022-06-17 高德信息技术有限公司 依赖模块的加载方法、装置及计算机程序产品
CN115185503A (zh) * 2022-05-17 2022-10-14 贝壳找房(北京)科技有限公司 前端低代码开发方法、装置、电子设备、介质及程序产品
CN115826974A (zh) * 2022-12-08 2023-03-21 浪潮通用软件有限公司 一种可插拔式的图表扩展方法及装置

Families Citing this family (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110889270B (zh) * 2018-08-16 2023-04-07 阿里巴巴集团控股有限公司 一种表单页面文档生成方法、表单页面渲染方法及装置
CN110968358A (zh) * 2018-09-30 2020-04-07 北京国双科技有限公司 一种基于浏览器插件加载脚本模块的方法及装置
CN110083845B (zh) * 2019-04-25 2023-06-16 四川语言桥信息技术有限公司 网页翻译方法及系统
CN110244955B (zh) * 2019-05-29 2023-04-18 广州至真信息科技有限公司 一种应用的处理方法、装置、服务器和介质
CN110989992B (zh) * 2019-10-30 2023-10-31 无线生活(北京)信息技术有限公司 资源处理方法及装置
CN112788083B (zh) * 2019-11-11 2023-09-01 福建天晴数码有限公司 一种基于ftp进行引擎资源文件传输管理的方法
CN110865852B (zh) * 2019-11-19 2023-06-30 北京字节跳动网络技术有限公司 网页组件的加载方法、装置、电子设备、及存储介质
CN111736829A (zh) * 2020-06-16 2020-10-02 上海英方软件股份有限公司 一种基于Web国际化切换页面样式的方法及装置
CN112052048B (zh) * 2020-08-07 2024-07-02 深圳市欢太科技有限公司 数据加载方法及装置、设备、存储介质
CN115729557B (zh) * 2022-11-16 2024-01-26 格兰菲智能科技有限公司 脚本处理方法和装置

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6578192B1 (en) * 1999-10-20 2003-06-10 International Business Machines Corporation Method and system for supporting dynamic document content expressed in a component-level language
US20040015954A1 (en) * 2001-03-19 2004-01-22 Autodesk, Inc. Method and apparatus for delivering electronic information
CN101669114A (zh) * 2007-04-27 2010-03-10 微软公司 动态加载脚本
CN101963987A (zh) * 2010-09-30 2011-02-02 百度在线网络技术（北京）有限公司 一种用于生成网页文件和加载网页文件的方法与设备

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP2090990B1 (en) * 2008-02-14 2018-11-28 BlackBerry Limited A method, server and system for optimizing html-based content
CN101739458B (zh) * 2009-12-02 2013-03-27 中兴通讯股份有限公司 多语化资源的更新方法和系统
CN102902781B (zh) * 2012-09-28 2015-08-05 五八有限公司 网页页面装修推送方法及装置
CN103164246B (zh) * 2013-03-21 2017-03-08 小米科技有限责任公司 一种提供多语言支持的方法和装置
CN103645913B (zh) * 2013-11-15 2017-12-01 广州杰赛科技股份有限公司 J2ee系统中的语言加载方法及装置
CN105138555B (zh) * 2015-07-20 2019-08-06 新浪网技术(中国)有限公司 一种网页多语言国际化的加载方法和装置

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6578192B1 (en) * 1999-10-20 2003-06-10 International Business Machines Corporation Method and system for supporting dynamic document content expressed in a component-level language
US20040015954A1 (en) * 2001-03-19 2004-01-22 Autodesk, Inc. Method and apparatus for delivering electronic information
CN101669114A (zh) * 2007-04-27 2010-03-10 微软公司 动态加载脚本
CN101963987A (zh) * 2010-09-30 2011-02-02 百度在线网络技术（北京）有限公司 一种用于生成网页文件和加载网页文件的方法与设备

Cited By (18)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111273909A (zh) * 2018-12-04 2020-06-12 北京京东尚科信息技术有限公司 应用程序管理方法和装置
CN112416311A (zh) * 2019-08-22 2021-02-26 北京国双科技有限公司 数据处理方法和装置、存储介质及处理器
CN112540745A (zh) * 2019-09-20 2021-03-23 北京国双科技有限公司 一种组件渲染方法及装置
CN110825373B (zh) * 2019-10-10 2023-04-25 上海上湖信息技术有限公司 一种移动端动态化方法及装置
CN110825373A (zh) * 2019-10-10 2020-02-21 上海上湖信息技术有限公司 一种移动端动态化方法及装置
CN111124482A (zh) * 2019-12-25 2020-05-08 北京达佳互联信息技术有限公司 文案信息的配置方法和装置
CN111124482B (zh) * 2019-12-25 2024-05-07 北京达佳互联信息技术有限公司 文案信息的配置方法和装置
CN111679825A (zh) * 2020-04-24 2020-09-18 平安国际智慧城市科技股份有限公司 一种层叠样式表生成方法、装置、计算机设备及存储介质
CN112181374A (zh) * 2020-09-25 2021-01-05 广州力挚网络科技有限公司 一种数据整合方法、装置、电子设备及存储介质
CN112181374B (zh) * 2020-09-25 2024-03-12 广州力挚网络科技有限公司 一种数据整合方法、装置、电子设备及存储介质
CN112800724A (zh) * 2020-12-29 2021-05-14 杭州涂鸦信息技术有限公司 可视化配置模板的可读文件导出方法及相关装置
CN113626014A (zh) * 2021-08-09 2021-11-09 宝宝巴士股份有限公司 一种基于Xcode的插件实现方法
CN113918173A (zh) * 2021-10-26 2022-01-11 杭州安恒信息技术股份有限公司 一种模板渲染方法、模板渲染系统、存储介质和渲染设备
CN114238819A (zh) * 2021-12-22 2022-03-25 北京升明科技有限公司 网页渲染方法及装置
CN114637548A (zh) * 2022-02-18 2022-06-17 高德信息技术有限公司 依赖模块的加载方法、装置及计算机程序产品
CN115185503A (zh) * 2022-05-17 2022-10-14 贝壳找房(北京)科技有限公司 前端低代码开发方法、装置、电子设备、介质及程序产品
CN115185503B (zh) * 2022-05-17 2023-11-14 贝壳找房(北京)科技有限公司 前端低代码开发方法、装置、电子设备、介质
CN115826974A (zh) * 2022-12-08 2023-03-21 浪潮通用软件有限公司 一种可插拔式的图表扩展方法及装置

Also Published As

Publication number Publication date
TW201732647A (zh) 2017-09-16
CN106990976A (zh) 2017-07-28

Similar Documents

Publication Publication Date Title
WO2017124952A1 (zh) 一种网页脚本加载方法和装置
CN112632437B (zh) 一种网页页面生成方法、装置及计算机可读存储介质
US10726195B2 (en) Filtered stylesheets
CN110442330B (zh) 列表组件转换方法、装置、电子设备及存储介质
CN106293675B (zh) 系统静态资源加载方法及装置
US9952835B2 (en) Generation of hybrid enterprise mobile applications in cloud environment
CN104714982A (zh) 一种网页的加载方法和系统
CN107943465B (zh) 一种生成html表单的方法及装置
CN111679828B (zh) 一种数据处理的方法及装置、电子设备、存储介质
US11003835B2 (en) System and method to convert a webpage built on a legacy framework to a webpage compatible with a target framework
WO2016177341A1 (zh) 接口调用方法、装置及终端
CN105630522A (zh) 一种Web应用的更新方法、装置和系统
US20160072927A1 (en) Odata enabled mobile software applications
TWI683225B (zh) 腳本生成方法與裝置
CN109460546A (zh) 表单生成方法、装置及电子设备
CN111124481A (zh) 网页应用程序的安装包生成方法、装置、存储介质及设备
US20130151571A1 (en) Interface defined virtual data fields
CN115599359A (zh) 一种代码生成方法、装置、设备及介质
CN113360385B (zh) 一种测试方法、装置、设备及介质
EP3080692B1 (en) User interface framework
CN114254232B (zh) 云产品页面生成方法、装置、计算机设备和存储介质
CN117519691B (zh) 应用程序处理方法、装置、计算机设备和存储介质
CN107077484B (zh) 生成应用的网络浏览器视图
CN116127231A (zh) 页面嵌入方法及相关设备
CN119336432A (zh) 网页处理方法、装置及存储介质

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 17740983

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 17740983

Country of ref document: EP

Kind code of ref document: A1