CN109522507A - A kind of method of web pages component unified management - Google Patents
A kind of method of web pages component unified management Download PDFInfo
- Publication number
- CN109522507A CN109522507A CN201811339052.6A CN201811339052A CN109522507A CN 109522507 A CN109522507 A CN 109522507A CN 201811339052 A CN201811339052 A CN 201811339052A CN 109522507 A CN109522507 A CN 109522507A
- Authority
- CN
- China
- Prior art keywords
- page
- logic
- web pages
- unified management
- content
- 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.)
- Granted
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR 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
- G06F9/44526—Plug-ins; Add-ons
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)
Abstract
The present invention relates to a kind of methods of web pages component unified management, are based on JS module loader Require JS, web page template is turned to page assembly；By defining different configuration items on HTML element, the page assembly of Different Logic is obtained；The content of pages of the page assembly of Different Logic is associated with one by one with specified js operation logic, realizes the page elements splicing being dynamically embedded into unified operation logic, progress page nesting by calling mutually.The present invention has accomplished page assembly management in addition to continuing to use Require JS modularization management technology, and different content of pages is customized according to different configuration items, realizes similar logical operation.Implementation of the invention, greatly reduces the repetition of code, while being managed collectively pattern and interaction logic.Meanwhile in such a way that the page is with the binding of js file content, solves the problems, such as that the page insertion page imports difficult interface, accomplished that the page is also a kind of component, the reuse of the page.
Description
Technical field
The present invention relates to management of webpage technical fields, more specifically to a kind of method of web pages component unified management.
Background technique
The prior art of web pages component management probably includes the method for tradition js, and the method based on Require JS.
Wherein, Require JS is a set of front-end moduleization management library.It is different from traditional<script>label loading method,
Require JS has accomplished to form modularization reference after asynchronous load.Traditional js code, it is necessary to be first to have introduced some js
After file, the tool or method defined inside js file before the file introduced afterwards can just be used, but also to avoid ordering
Code before having been rewritten caused by name conflict inside js file.
It repeats to quote the same js resource in the different pages, traditional js page loading method is literary by the repetitive requests js
Part causes the waste of bandwidth.And the resource defined inside Require JS configuration, if quoted in the page before
Cross the js file resource, it will be introduced into current page in a modular way, will not re-request from program, reduce bandwidth.
But Require JS in terms of page rendering without any advantage, original html page label can only be write, and
And all operations of label are realized with duplicate js code, wherein many operations all re-define, cause js code redundancy.
Summary of the invention
It is an object of the invention to overcome the deficiencies of the prior art and provide a kind of way to manage for continuing to use Require JS,
It can satisfy the method for the web pages component unified management of page rendering demand simultaneously.
Technical scheme is as follows:
A kind of method of web pages component unified management, is based on JS module loader Require JS, web page template is turned to
Page assembly；By defining different configuration items on HTML element, the page assembly of Different Logic is obtained；By Different Logic
The content of pages of page assembly is associated with one by one with specified js operation logic, by calling mutually and unified operation logic, progress
The page is nested, realizes the page elements splicing being dynamically embedded into.
Preferably, the page assembly of web page template renders to obtain different content of pages according to configuration item.
Preferably, using in html tag<cname>,<cparam>Custom Attributes is as configuration item.
Preferably, the page assembly of web page template supports event monitoring, allow to prevent event from transmitting in operation layer.
Preferably, being introduced in a manner of subpage frame to parent page, while subpage frame is also a kind of when carrying out page nesting
Component.
Preferably, subpage frame is bound one by one by the content and corresponding js operation logic of jsp file, parent page allows
It positions to the page assembly of subpage frame, is called subpage frame method；Parent page transmits downwards itself operating method simultaneously,
Subpage frame directly accesses parent page logical operation.
It is obtained preferably, the js file of content of pages and execution operation logic reads text by ajax.
Beneficial effects of the present invention are as follows:
The method of web pages component unified management of the present invention, in addition to continuing to use Require JS modularization management technology,
Page assembly management is accomplished simultaneously, different content of pages is customized according to different configuration items, realizes similar logical operation.
Implementation of the invention, greatly reduces the repetition of code, while being managed collectively pattern and interaction logic.Meanwhile using the page with
The mode of js file content binding solves the problems, such as that the page insertion page imports difficult interface, has accomplished that the page is also a kind of group
Part, the reuse of the page.
Detailed description of the invention
Fig. 1 is based on page structure schematic diagram of the invention.
Specific embodiment
The present invention is further described in detail with reference to the accompanying drawings and embodiments.
The present invention in order to solve limited introduction of the existing technology sequence, code redundancy, the wasting of resources, be easy to report an error,
The deficiencies of father and son's page can not interact provides a kind of method of web pages component unified management, is based on JS module loader Require
Web page template is turned to page assembly by JS；By defining different configuration items on HTML element, the page of Different Logic is obtained
Component；The content of pages of the page assembly of Different Logic is associated with one by one with specified js operation logic, by calling mutually and
Unified operation logic carries out page nesting, realizes the page elements splicing being dynamically embedded into.
The present invention introduces the concept that front end JavaScript object is inherited by the Require JS modularization management page,
The extension of attribute and method is carried out on the basis of default configuration.In the present invention, the page assembly of web page template is according to configuration
Item rendering obtains different content of pages.It is in collocation html tag,<cname>,<cparam>in html tag is customized
Attribute obtains the page assembly of Different Logic by flexibly defining configuration item as configuration item.
Meanwhile the page assembly of web page template supports event monitoring, allows to prevent event from transmitting in operation layer.That is this hair
It is bright to support flexible event monitoring and operation layer that event is prevented to transmit, the component Configuration flexibly rendered can be inherited, it is unlimited inherit with
Monitoring event carries out business-binding.
Method of the present invention is when realizing page nesting, according to the js operation logic one for obtaining content of pages and specifying
One association, is introduced into parent page, while subpage frame is also a kind of component in a manner of subpage frame, convenient to call and operate mutually.
Specifically, it when carrying out page nesting, is introduced in a manner of subpage frame to parent page.Subpage frame passes through the content of jsp file and right
The js operation logic answered is bound one by one, and parent page allows to position to the page assembly of subpage frame, is called subpage frame method；Together
When parent page itself operating method is transmitted downwards, directly access parent page logical operation in subpage frame.Wherein, content of pages and
The js file for executing operation logic reads text by ajax and obtains.
The technical characterstic and advantage and disadvantage of the present invention with the prior art are summarized, as shown in the table:
The thinking for constructing element automatically the present invention is based on Require JS module management and the page is managed web pages component,
In the embodiment of page structure as shown in Figure 1, in head system information, can dynamic display system essential information.Left side
Menu entries are configurable to tree-structured；Also, the menu entries of the specific page will show specified column in right content area
The table page；For the menu repeatedly entered, the content of opening will be directly displayed, may also be configured to re-request.Right side is aobvious
Show in region, corresponds to menu on the left side entrance, show corresponding menu.
Above-described embodiment is intended merely to illustrate the present invention, and is not used as limitation of the invention.As long as according to this hair
Bright technical spirit is changed above-described embodiment, modification etc. will all be fallen in the scope of the claims of the invention.
Claims (7)
1. a kind of method of web pages component unified management, which is characterized in that JS module loader Require JS is based on, by webpage
Template turns to page assembly；By defining different configuration items on HTML element, the page assembly of Different Logic is obtained；It will not
Content of pages with the page assembly of logic is associated with one by one with specified js operation logic, is patrolled by calling mutually with unified operation
Volume, page nesting is carried out, realizes the page elements splicing being dynamically embedded into.
2. the method for web pages component unified management according to claim 1, which is characterized in that the page group of web page template
Part renders to obtain different content of pages according to configuration item.
3. the method for web pages component according to claim 2 unified management, which is characterized in that by html tag <
Cname>,<cparam>Custom Attributes is as configuration item.
4. the method for web pages component unified management according to claim 3, which is characterized in that the page group of web page template
Part supports event monitoring, allows to prevent event from transmitting in operation layer.
5. the method for web pages component unified management according to claim 1, which is characterized in that when carrying out page nesting, with
The mode of subpage frame is introduced to parent page, while subpage frame is also a kind of component.
6. the method for web pages component unified management according to claim 5, which is characterized in that subpage frame passes through jsp file
Content and corresponding js operation logic bind one by one, parent page allows to position to the page assembly of subpage frame, is called son
Page method；Parent page transmits downwards itself operating method simultaneously, directly accesses parent page logical operation in subpage frame.
7. the method for web pages component according to claim 6 unified management, which is characterized in that content of pages and execute operation
The js file of logic reads text by ajax and obtains.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811339052.6A CN109522507B (en) | 2018-11-12 | 2018-11-12 | Method for uniformly managing webpage components |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811339052.6A CN109522507B (en) | 2018-11-12 | 2018-11-12 | Method for uniformly managing webpage components |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN109522507A true CN109522507A (en) | 2019-03-26 |
| CN109522507B CN109522507B (en) | 2021-08-13 |
Family
ID=65773528
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201811339052.6A Active CN109522507B (en) | 2018-11-12 | 2018-11-12 | Method for uniformly managing webpage components |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109522507B (en) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112558945A (en) * | 2020-11-25 | 2021-03-26 | 紫光云技术有限公司 | Novel modular page design method |
| CN114265997A (en) * | 2022-03-01 | 2022-04-01 | 成都鲁易科技有限公司 | Page information output method, device, storage medium and terminal |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US7542983B1 (en) * | 2006-11-16 | 2009-06-02 | Bruso Kelsey L | Delaying automated data page merging in a B+tree until after committing the transaction |
| CN104050274A (en) * | 2014-06-25 | 2014-09-17 | 国家电网公司 | HTML page nesting method and device |
| CN104572263A (en) * | 2014-12-30 | 2015-04-29 | 腾讯科技（深圳）有限公司 | Page data interaction method, related device and system |
| CN104714980A (en) * | 2013-12-17 | 2015-06-17 | 阿里巴巴集团控股有限公司 | Page nesting path determination method and device |
| CN106020823A (en) * | 2016-05-19 | 2016-10-12 | 浪潮电子信息产业股份有限公司 | Front-end Web presentation and data separation and page quick response mode |
| CN107273528A (en) * | 2017-06-28 | 2017-10-20 | 努比亚技术有限公司 | A kind of front and back end separation method, mobile terminal and computer-readable recording medium |
-
2018
- 2018-11-12 CN CN201811339052.6A patent/CN109522507B/en active Active
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US7542983B1 (en) * | 2006-11-16 | 2009-06-02 | Bruso Kelsey L | Delaying automated data page merging in a B+tree until after committing the transaction |
| CN104714980A (en) * | 2013-12-17 | 2015-06-17 | 阿里巴巴集团控股有限公司 | Page nesting path determination method and device |
| CN104050274A (en) * | 2014-06-25 | 2014-09-17 | 国家电网公司 | HTML page nesting method and device |
| CN104572263A (en) * | 2014-12-30 | 2015-04-29 | 腾讯科技（深圳）有限公司 | Page data interaction method, related device and system |
| CN106020823A (en) * | 2016-05-19 | 2016-10-12 | 浪潮电子信息产业股份有限公司 | Front-end Web presentation and data separation and page quick response mode |
| CN107273528A (en) * | 2017-06-28 | 2017-10-20 | 努比亚技术有限公司 | A kind of front and back end separation method, mobile terminal and computer-readable recording medium |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112558945A (en) * | 2020-11-25 | 2021-03-26 | 紫光云技术有限公司 | Novel modular page design method |
| CN114265997A (en) * | 2022-03-01 | 2022-04-01 | 成都鲁易科技有限公司 | Page information output method, device, storage medium and terminal |
| CN114265997B (en) * | 2022-03-01 | 2022-05-20 | 成都鲁易科技有限公司 | Page information output method, device, storage medium and terminal |
Also Published As
| Publication number | Publication date |
|---|---|
| CN109522507B (en) | 2021-08-13 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106528129B (en) | A kind of Web application interface generation system and method | |
| US9720658B2 (en) | Application creation method and apparatus | |
| US20190236118A1 (en) | Filtered stylesheets | |
| US7870482B2 (en) | Web browser extension for simplified utilization of web services | |
| CN101322096B (en) | Metadata driven user interface | |
| CN110109659A (en) | A kind of system that realizing front end applications scaffold and server | |
| CN109634598A (en) | A kind of page display method, device, equipment and storage medium | |
| KR20200043467A (en) | Method and terminal device for extracting web page content | |
| CN109614569A (en) | Page rendering method, apparatus and intelligent terminal | |
| CN105446740A (en) | MVVM (Model-View-View Model) architecture based Web front-end presentation system | |
| CN113504908A (en) | Business code generation method and device, electronic equipment and computer readable medium | |
| CN113126990B (en) | Page development method, device, equipment and storage medium | |
| CN109254771A (en) | A kind of monitoring page generation method and device | |
| WO2019134237A1 (en) | Multi-page switching method, device, terminal apparatus, and storage medium | |
| CN106909361A (en) | Web development approaches and device based on masterplate engine | |
| CN102981844B (en) | The browser that webpage main body element is processed and method | |
| CN102981848B (en) | Webpage main body element process browser and method | |
| CN110727429B (en) | Front-end page generation method, device and equipment | |
| CN107357817A (en) | A kind of Web page module design and its Asynchronous loading method towards JSON | |
| CN109522507A (en) | A kind of method of web pages component unified management | |
| CN103778128A (en) | List information drawing method and device | |
| CN102253986A (en) | Method and device for improving webpage displaying effect in multiple terminals | |
| US8707196B2 (en) | Dynamic, set driven, ribbon, supporting deep merge | |
| CN105740478A (en) | Method and device for realizing paging sorting table without refreshing | |
| CN108885544A (en) | Front end page internationalization processing method, application server and computer readable 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 | ||
| TA01 | Transfer of patent application right |
Effective date of registration: 20210630 Address after: Room 1601, Guangtong building, No.11, Hubin East Road, Siming District, Xiamen City, Fujian Province, 361000 Applicant after: Xiamen Zhuowang Information Technology Co.,Ltd. Address before: Unit 1602-2, No.11, East Hubin Road, Siming District, Xiamen City, Fujian Province 361000 Applicant before: XIAMEN ZHUO SI CHUANG XIANG EDUCATION TECHNOLOGY Co.,Ltd. |
|
| TA01 | Transfer of patent application right | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |