CN104102485A - Html-based module encapsulation loading method - Google Patents
Html-based module encapsulation loading method Download PDFInfo
- Publication number
- CN104102485A CN104102485A CN201410300090.6A CN201410300090A CN104102485A CN 104102485 A CN104102485 A CN 104102485A CN 201410300090 A CN201410300090 A CN 201410300090A CN 104102485 A CN104102485 A CN 104102485A
- Authority
- CN
- China
- Prior art keywords
- html
- module
- fragment
- loading method
- javascript code
- 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
Landscapes
- Stored Programmes (AREA)
Abstract
The invention relates to the technical field of networks, in particular to an Html-based module encapsulation loading method. The method is characterized by comprising the following steps: 1) initializing local variables defined by an Html module; 2) carrying out state initialization on basic elements in an HTML fragment composed of different HTML elements; 3) adding the initialized HTML elements to an HTML page, and completing rendering in a browser; 4) when the user action is responded, carrying out the property and method defined in the js (JavaScript) through a logical processing function by a program. By adopting the method, reuse of the HTML module can be maximized.
Description
Technical field
The present invention relates to networking technology area, relate in particular to a kind of module package loading method based on Html.
Background technology
In the program development based on browser, it is will carry out design and development content that the presenting of page elements, client (in browser) logical process, server side logic call etc.Numerous HTML fundamental elements forms (as: div, input, label etc.) and has formed a complete page layout, and only has complete html page in browser, normally to show.When these elements of needs response users' page operation, when carrying out processing logic, also need directly to write in html page JavaScript code or quote JavaScript code file (* .js).Wanting from design angle code (page elements formation, layout and JavaScript code) can be farthest multiplexing, and identical local page is formed can be used at other pages, and has the same presenting and logical process mode.
Summary of the invention
The object of the invention is to overcome the shortcoming of prior art, a kind of module package loading method based on Html is provided.
For solving above technical matters, technical scheme of the present invention is: a kind of module package loading method based on Html, and its difference is, its step comprises:
1) local variable of initialization HTML module definition;
2) fundamental element in the HTML fragment being made up of different html element elements is carried out to state initialization;
3) html element element complete initialization is added in html page, and complete presenting in browser;
4) in the time that response operates to user, program is carried out the attribute and the method that in js, define by logical process function.
By above scheme, described HTML module is processed file by HTML fragment and JavaScript code logic and is formed, and described JavaScript code logic is processed file and is used for carrying out HTML fragment and calls at the presenting of HTML, logical process, server side logic.
By above scheme, it is corresponding one by one that described HTML fragment and JavaScript code logic are processed file.
Contrast prior art, beneficial features of the present invention is: can make HTML module obtain farthest multiplexing, reach the object of Software for Design.
Brief description of the drawings
Fig. 1 is that the HTML module in the embodiment of the present invention is quoted frame diagram;
Fig. 2 is the HTML module loading process flow diagram in the embodiment of the present invention.
Embodiment
By reference to the accompanying drawings the present invention is described in further detail below by embodiment.
Please refer to Fig. 1, the present invention is based on the disposal route of many examples big file uploading of browser, the module package loading method based on Html, its step comprises:
1) local variable of initialization HTML module definition (calling constructor function);
2) fundamental element in the HTML fragment being made up of different html element elements is carried out to state (as: background color, displaying contents etc.) initialization (calling rendering function);
3) html element element complete initialization is added in html page, and complete presenting in browser (calling postCreate function);
4) in the time that response operates to user, program is carried out the attribute and the method (calling event response function) that in js, define by logical process function.
Concrete, described HTML module is processed file by HTML fragment and JavaScript code logic and is formed, and described JavaScript code logic is processed file and is used for carrying out HTML fragment and calls at the presenting of HTML, logical process, server side logic.
Concrete, it is corresponding one by one that described HTML fragment and JavaScript code logic are processed file.
Under traditional Design Mode, if multiple html page need to realize quote same service logic need to be by many parts of identical Code copyings.Use the solution of the present invention can make HTML module obtain the multiplexing of maximum depth, HTML fragment can be used in different html pages.
It is man-to-man relation that HTML fragment and JavaScript code logic are processed file.HTML fragment is responsible for the basic layout of page elements, and JavaScript code logic is processed file and is responsible for controlling these elements.
Html page by reference JavaScript code logic processing file is determined the position that HTML module presents in the page.
JavaScript code logic in HTML module is processed in file, can define the actual physical file path of HTML fragment.
The fundamental element of the HTML fragment meeting definition module in HTML module forms and layout.
Html page by reference JavaScript code logic process file load HTML module.In the time that html page loads, browser can be carried out the logic of JavaScript code file definition, to load HTML module.
Example code:
HTML fragment:
HTML quotes module:
<！DOCTYPE?html>
<html?xmlns＝"http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<script src=" js/widgets/Module.js " ></script>//quote HTML module
</body>
</html>
Above content is in conjunction with concrete embodiment further description made for the present invention, can not assert that specific embodiment of the invention is confined to these explanations.For general technical staff of the technical field of the invention, without departing from the inventive concept of the premise, can also make some simple deduction or replace, all should be considered as belonging to protection scope of the present invention.
Claims (3)
1. the module package loading method based on Html, is characterized in that, its step comprises:
1) local variable of initialization HTML module definition;
2) fundamental element in the HTML fragment being made up of different html element elements is carried out to state initialization;
3) html element element complete initialization is added in html page, and complete presenting in browser;
4) in the time that response operates to user, program is carried out the attribute and the method that in js, define by logical process function.
2. the module package loading method based on Html according to claim 1, it is characterized in that: described HTML module is processed file by HTML fragment and JavaScript code logic and formed, described JavaScript code logic is processed file and is called at the presenting of HTML, logical process, server side logic for carrying out HTML fragment.
3. the module package loading method based on Html according to claim 2, is characterized in that: it is corresponding one by one that described HTML fragment and JavaScript code logic are processed file.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410300090.6A CN104102485A (en) | 2014-06-26 | 2014-06-26 | Html-based module encapsulation loading method |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410300090.6A CN104102485A (en) | 2014-06-26 | 2014-06-26 | Html-based module encapsulation loading method |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN104102485A true CN104102485A (en) | 2014-10-15 |
Family
ID=51670663
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201410300090.6A Pending CN104102485A (en) | 2014-06-26 | 2014-06-26 | Html-based module encapsulation loading method |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN104102485A (en) |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104866347A (en) * | 2015-05-22 | 2015-08-26 | 国云科技股份有限公司 | Method for dynamically loading JS and CSS files |
| CN106250141A (en) * | 2016-07-29 | 2016-12-21 | 四川天邑康和通信股份有限公司 | A kind of method for designing of WEB UI plug-in unit |
| CN106951271A (en) * | 2017-04-18 | 2017-07-14 | 北京思特奇信息技术股份有限公司 | A kind of module loading method and system based on JavaScript |
| CN108664456A (en) * | 2017-03-31 | 2018-10-16 | 北京京东尚科信息技术有限公司 | A kind of method of the function of display elements in dynamic construction document |
Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103425773A (en) * | 2013-08-02 | 2013-12-04 | 深圳市菁优网络科技有限公司 | Method for rapidly displaying mathematical formula in web page by utilizing native Html (Hypertext Markup Language) |
| CN103543998A (en) * | 2012-07-17 | 2014-01-29 | 上海互基信息科技有限公司 | WEB3D image engine generating method based on HTML5 |
-
2014
- 2014-06-26 CN CN201410300090.6A patent/CN104102485A/en active Pending
Patent Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103543998A (en) * | 2012-07-17 | 2014-01-29 | 上海互基信息科技有限公司 | WEB3D image engine generating method based on HTML5 |
| CN103425773A (en) * | 2013-08-02 | 2013-12-04 | 深圳市菁优网络科技有限公司 | Method for rapidly displaying mathematical formula in web page by utilizing native Html (Hypertext Markup Language) |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104866347A (en) * | 2015-05-22 | 2015-08-26 | 国云科技股份有限公司 | Method for dynamically loading JS and CSS files |
| CN106250141A (en) * | 2016-07-29 | 2016-12-21 | 四川天邑康和通信股份有限公司 | A kind of method for designing of WEB UI plug-in unit |
| CN106250141B (en) * | 2016-07-29 | 2021-12-10 | 四川天邑康和通信股份有限公司 | Design method of WEB UI plug-in |
| CN108664456A (en) * | 2017-03-31 | 2018-10-16 | 北京京东尚科信息技术有限公司 | A kind of method of the function of display elements in dynamic construction document |
| CN108664456B (en) * | 2017-03-31 | 2021-12-03 | 北京京东尚科信息技术有限公司 | Method for dynamically constructing function of display element in document |
| CN106951271A (en) * | 2017-04-18 | 2017-07-14 | 北京思特奇信息技术股份有限公司 | A kind of module loading method and system based on JavaScript |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| KR102179149B1 (en) | Page component dynamic layout | |
| US9384503B2 (en) | Terminal apparatus, advertisement display control apparatus, and advertisement display method | |
| Kim et al. | Nanoparticle stripes, grids, and ribbons produced by flow coating | |
| US20150278171A1 (en) | Single page application authoring in a content management system | |
| CN103544059B (en) | The realization method and system of pending buffer effect during a kind of application switching | |
| CN104102485A (en) | Html-based module encapsulation loading method | |
| WO2019134237A1 (en) | Multi-page switching method, device, terminal apparatus, and storage medium | |
| CN108829398B (en) | Mobile terminal page interaction realization method and device | |
| CN104854559A (en) | Internet page unit aligning method and apparatus | |
| WO2015158304A1 (en) | Data processing method and apparatus | |
| US11659076B2 (en) | Initiating application execution with trigger characters | |
| Pearl-Martinez | Women at the forefront of the clean energy future | |
| TW201732691A (en) | Information processing method and device for displaying service completion status | |
| CN108509228B (en) | Page loading method, terminal equipment and computer readable storage medium | |
| CN104298506A (en) | Achievement method for webpage paging plug-in | |
| CN105630319A (en) | Two-dimensional code generation method and apparatus as well as secure decoding method and apparatus for two-dimensional code | |
| CN107105347A (en) | With the method for div technological development WEBOS intelligent televisions front end | |
| CN108509229B (en) | Window cross-domain control method, terminal equipment and computer readable storage medium | |
| CN107918552B (en) | Light application calling method and device, client device and electronic equipment | |
| US20150154314A1 (en) | Method, apparatus and terminal for webpage content browsing | |
| CN103500101B (en) | A kind of screen locking method, device and terminal | |
| KR101341996B1 (en) | N-screen layout system using semantic web tag of html 5 and method threof | |
| CN108228708B (en) | Big data ETL system and scheduling method thereof | |
| US20150242256A1 (en) | Techniques to facilitate communication across domains | |
| CN104932877A (en) | Method for designing application program interface for intelligent terminal |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20141015 |