CA3152833C

CA3152833C - Webpage editing method and device

Info

Publication number: CA3152833C
Application number: CA3152833A
Authority: CA
Inventors: Haitao Sun; Yaqiu SHI; Yiming Ding; Chengying YANG; Qian Sun
Original assignee: 10353744 Canada Ltd
Current assignee: 10353744 Canada Ltd
Priority date: 2019-08-26
Filing date: 2020-06-24
Publication date: 2023-04-25
Anticipated expiration: 2040-06-24
Also published as: CN110705231A; CA3152833A1; CN110705231B; WO2021036448A1

Abstract

A webpage editing method and apparatus, belonging to the technical field of computer information. The method comprises: receiving a data acquisition request input by a user by means of a webpage control, wherein the webpage control is used to represent a data attribute of a data source (101); sending the data acquisition request to a server, and acquiring a data source returned by the server according to the data acquisition request (102); receiving a rendering request (103); and according to a rendering mode corresponding to the rendering request, performing a rendering operation on the data source (104). According to the method, not only is an embeddable control which directly facilitates data source acquisition configured, a procedure that integrates screening, editing and rendering is also realized, thereby achieving a real-time data update function, and improving the efficiency of content publication.

Description

WEBPAGE EDITING METHOD AND DEVICE
BACKGROUND OF THE INVENTION
Technical Field [0001] The present invention relates to the field of computer information technology, and more particularly to a webpage editing method and a webpage editing device.
Description of Related Art

[0002] Browser-based text editors are currently available on the market, and all of these are essentially directed to the amendments of text styles, for example, such functions as making the font bold, italics, font-setting, coloring, locating and image inserting, etc. In the age of information explosion today, how should the great quantities of data produced everyday be timely presented to users? The conventional Excel or the mode of editing after manual query surely cannot keep up with the pace of the age. There is therefore an urgent need to propose a webpage editing solution capable of integrating data source inserting, editing and rendering as a whole, so as to overcome deficiencies prevailing in the state of the art.
SUMMARY OF THE INVENTION

[0003] In order to solve the problems pending in prior-art technology, embodiments of the present invention provide a webpage editing method and a webpage editing device, whose webpage editing solutions not only configure embeddable controls that directly facilitate obtainment of the data source, but also achieve an integrated process of filtering, editing and rendering, realize real-time data updating function, and greatly enhance content publishing efficiency. The technical solutions are as follows.

Date Recue/Date Received 2022-02-28

[0004] According to one aspect, there is provided a webpage editing method that comprises:

[0005] receiving a data obtaining request input by a user through a webpage control, wherein the webpage control is used to characterize data attributes of a data source;

[0006] sending the data obtaining request to a server, and obtaining a data source returned by the server according to the data obtaining request;

[0007] receiving a rendering request; and

[0008] performing a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.

[0009] Further, the step of receiving a data obtaining request input by a user through a webpage control includes:

[0010] receiving a request to select a webpage control from the user; and

[0011] receiving a condition input to the selected webpage control from the user.

[0012] Further, the webpage control at least includes a time control, a data field control and/or a counted quantity control, and the condition input includes a field list option, a filtering condition option, a sorting rule option and/or a configuration condition.

[0013] Further, the step of sending the data obtaining request to a server, and obtaining a data source returned by the server according to the data obtaining request includes:

[0014] matching a target query interface from a preset query interface list according to data identification information in the data obtaining request and correspondence relation between pre-stored data identifications and query interfaces; and

[0015] sending the data obtaining request to the target query interface to obtain the data source.

[0016] Further, the rendering mode includes at least one preset rendering scenario.

[0017] Further, the rendering operation includes performing control pattern amendment or data Date Recue/Date Received 2022-02-28 text amendment to the webpage control.

[0018] According to another aspect, there is provided a webpage editing device that comprises:

[0019] a request receiving module, for receiving a data obtaining request and a rendering request input by a user through a webpage control, wherein the webpage control is used to characterize data attributes of a data source;

[0020] a data obtaining module, for sending the data obtaining request to a server, and obtaining a data source returned by the server according to the data obtaining request;
and

[0021] a rendering operating module, for performing a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.

[0022] Further, the request receiving module is employed for:

[0023] receiving a request to select a webpage control from the user; and

[0024] receiving a condition input to the selected webpage control from the user.

[0025] Further, the webpage control at least includes a time control, a data field control and/or a counted quantity control, and the condition input includes a field list option, a filtering condition option, a sorting rule option and/or a configuration condition.

[0026] Further, the data obtaining module is employed for:

[0027] matching a target query interface from a preset query interface list according to data identification information in the data obtaining request and correspondence relation between pre-stored data identifications and query interfaces; and

[0028] sending the data obtaining request to the target query interface to obtain the data source.

[0029] Further, the rendering mode includes at least one preset rendering scenario.

[0030] Further, the rendering operation includes performing control pattern amendment or data text amendment to the webpage control.

Date Recue/Date Received 2022-02-28

[0031] The technical solutions provided by the embodiments of the present invention bring about the following advantageous effects.

[0032] High efficiency: by adding an embeddable control to the conventional editor, and by enabling the control to configure the distal data source and then integrating with the conventional editor, the integrated function of filtering, editing and rendering is achieved;
the configuring, enquiring and rendering functions can be simultaneously realized through one windows form, so the cost of switching windows forms is reduced, in particular in this age of big data, real-time data contents updating function is provided with respect to colossal quantities of data, and content publishing efficiency is greatly enhanced.

[0033] Dynamic property: dynamic rendering and automatic updating of webpage editing are achieved by integrating such controls as time, index and dimension, the configuration area supports such plural condition queries as time, index, dimension, sorting and filtering, and the required data can be quickly generated according to these configurations.

[0034] Real-time property: after a date control has been configured, the latest data information can be viewed everyday without having to configure again.

[0035] Reusability: the improved webpage editing method makes it possible to store previously edited content formats as templates, to be integrated with such controls as internal dynamic date and other query conditions inside, whereby directly readable texts can be dynamically generated, and the production efficiency of the editing is greatly enhanced.
BRIEF DESCRIPTION OF THE DRAWINGS

[0036] In order to describe more clearly the technical solutions in the embodiments of the present Date Recue/Date Received 2022-02-28 invention, drawings required to illustrate the embodiments are briefly introduced below.
Apparently, the drawings introduced below are merely directed to some embodiments of the present invention, while persons ordinarily skilled in the art may further acquire other drawings on the basis of these drawings without spending creative effort in the process.

[0037] Fig. 1 is a flowchart illustrating the webpage editing method provided by an embodiment of the present invention;

[0038] Fig. 2 shows the webpage editing device provided by an embodiment of the present invention;

[0039] Fig. 3 is a demonstration view illustrating the functional area of a web editor realized by the web editing method and device provided by the embodiments of the present invention;

[0040] Fig. 4 is a view schematically illustrating the interaction process of webpage editing performed by the aforementioned web editor;

[0041] Fig. 5 is a view schematically illustrating the editing state of the aforementioned web editor;

[0042] Fig. 6 is a view schematically illustrating a control popup window of the webpage control;
and

[0043] Fig. 7 is a view schematically illustrating the rendered effect.
DETAILED DESCRIPTION OF THE INVENTION

[0044] To make more lucid and clear the objectives, technical solutions and advantages of the present invention, the technical solutions in the embodiments of the present invention will Date Recue/Date Received 2022-02-28 be clearly and comprehensively described below with reference to the accompanying drawings in the embodiments of the present invention. Apparently, the embodiments as described are merely partial, rather than the entire, embodiments of the present invention.
Any other embodiments makeable by persons ordinarily skilled in the art on the basis of the embodiments in the present invention without creative effort shall all fall within the protection scope of the present invention. As should be noted, the wordings "plural/more/a plurality of' mean "two and more" in the description of the present invention, unless otherwise definitely and specifically defined.

[0045] In the webpage editing method and device provided by the embodiments of the present invention, by adding an embeddable control to the conventional editor, and by enabling the control to configure the distal data source and then integrating with the conventional editor, the integrated function of filtering, editing and rendering is achieved; in particular in this age of big data, real-time data contents updating function is provided with respect to colossal quantities of data, and content publishing efficiency is greatly enhanced;
secondly, dynamic rendering and automatic updating of webpage editing are achieved by integrating such controls as time, index and dimension; moreover, the improved webpage editing method makes it possible to store previously edited content formats as templates, to be integrated with such controls as dynamic date and other query conditions inside, whereby directly readable texts can be dynamically generated, and the production efficiency of the editing is greatly enhanced. Accordingly, the webpage editing method according to the present invention can be popularized in many types of application scenarios in which webpage editing is involved, and is particularly suitable for the working scenario in which data is often required to be updated in real time to be summarized and reported.

[0046] The webpage editing method and device provided by the embodiments of the present invention are described in greater detail below with reference to specific embodiments and accompanying drawings.

Date Recue/Date Received 2022-02-28

[0047] Fig. 1 is a flowchart illustrating the webpage editing method provided by an embodiment of the present invention. As shown in Fig. 1, the webpage editing method provided by an embodiment of the present invention comprises the following steps.

[0048] 101 - receiving a data obtaining request input by a user through a webpage control, wherein the webpage control is used to characterize data attributes of a data source.

[0049] Specifically, a request to select a webpage control is received from the user, and condition input to the selected webpage control is received from the user. The webpage control at least includes a time control, a data field control and/or a counted quantity control, and can further include any other possible webpage control realizable by the state of the art, and each webpage control is equipped with a corresponding data interface for transferring the corresponding data source, so the webpage control can characterize data attributes of the data source. By way of example, with respect to a data field control, two access interfaces can be configured at the back end thereof: a data field list interface and a data field data query interface. With respect to condition input, plural filtering conditions are mainly present when the webpage control is configured, including a field list option, a filtering condition option, a sorting rule option and/or a configuration condition, for the user to select.

[0050] As should be noted, the process of Step 101 can be realized via other modes besides the aforementioned mode, and the specific modes are not restricted in the embodiments of the present invention.

[0051] 102 - sending the data obtaining request to a server, and obtaining a data source returned by the server according to the data obtaining request.

[0052] Specifically, a target query interface is matched from a preset query interface list Date Recue/Date Received 2022-02-28 according to data identification information in the data obtaining request and correspondence relation between pre-stored data identifications and query interfaces, and the data obtaining request is subsequently sent to the target query interface to obtain the data source. The data identification information in the data obtaining request is mainly the webpage control type identified by the user in the data obtaining request, for instance, the data identification information can be data fields, the data query interface corresponding thereto has a mapping correspondence relation, and the target query interface can be matched according to such correspondence relation.

[0053] In addition, the server here can be either a front end server or a back end server, and can be correspondingly set according to requirements, for instance, when the webpage control is a date control, the data source can be obtained from a front end server, if the webpage control is a data field control or a counted quantity control, the data source should be obtained from the back end. Preferably, the server is a back end server.

[0054] As should be noted, the process of Step 102 can be realized via other modes besides the aforementioned mode, and the specific modes are not restricted in the embodiments of the present invention.

[0055] 103 - receiving a rendering request.

[0056] The rendering request sent from the user is received, to satisfy the rendering requirement of the user on obtaining the data source.

[0057] 104 - performing a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.

[0058] Specifically, the rendering operation is performed on the data source according to a preset rendering scenario of the rendering mode. The rendering mode includes at least one preset Date Recue/Date Received 2022-02-28 rendering scenario. When there are plural preset rendering scenarios, it is possible for the user to select a rendering scenario while the rendering operation is being performed; the rendering operation includes performing control pattern amendment or data text amendment to the webpage control.

[0059] As should be noted, the process of Step 104 can be realized via other modes besides the aforementioned mode, and the specific modes are not restricted in the embodiments of the present invention.

[0060] As should be explained, in another embodiment, the aforementioned Step 103 of receiving a rendering request can also be simultaneously completed as the aforementioned Step 101 is performed.

[0061] In addition, an embodiment of the present invention further provides a webpage editing device. Fig. 2 shows the webpage editing device provided by an embodiment of the present invention. As shown in Fig. 2, the webpage editing device 2 comprises a request receiving module 21, a data obtaining module 22 and a rendering operating module 23.

[0062] The request receiving module 21 is employed for receiving a data obtaining request and a rendering request input by a user through a webpage control, and the webpage control is used to characterize data attributes of a data source. Specifically, the request receiving module 21 is employed for receiving a request to select a webpage control from the user, and receiving a condition input to the selected webpage control from the user.

[0063] The data obtaining module 22 is employed for sending the data obtaining request to a server, and obtaining a data source returned by the server according to the data obtaining request. Specifically, the data obtaining module 22 is employed for matching a target query interface from a preset query interface list according to data identification information in the data obtaining request and correspondence relation between pre-stored Date Recue/Date Received 2022-02-28 data identifications and query interfaces, and sending the data obtaining request to the target query interface to obtain the data source.

[0064] The rendering operating module 23 is employed for performing a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.
The rendering mode includes at least one preset rendering scenario; when there are plural preset rendering scenarios, it is possible for the user to select a rendering scenario while the rendering operation is being performed; the rendering operation includes performing control pattern amendment or data text amendment to the webpage control.

[0065] As should be noted, when the webpage editing device provided by this embodiment performs a webpage editing business, the division into the aforementioned various functional modules is merely by way of example, while it is possible, in actual application, to base on requirements to assign the functions to different functional modules for completion, that is to say, to divide the internal structure of the device into different functional modules to complete the entire or partial functions described above. In addition, the webpage editing device provided by this embodiment pertains to the same conception as the webpage editing method provided by the method embodiment ¨ see the corresponding method embodiment for its specific realization process, while no repetition will be made in this context.

[0066] A web editor realized according to the webpage editing method and device provided by the embodiments of the present invention is introduced as follows.

[0067] Fig. 3 is a demonstration view illustrating the functional area of a web editor. Fig. 4 is a view schematically illustrating the interaction process of webpage editing performed by the web editor. Fig. 5 is a view schematically illustrating the editing state of the web editor.
Fig. 6 is a view schematically illustrating a control popup window of the webpage control.
Fig. 7 is a view schematically illustrating the rendering effect.
Date Recue/Date Received 2022-02-28

[0068] As shown in Figs. 3 through 7, the web editor is a visual web front end editor based on the B/S architecture, and mainly consists of a nodejs server, a browser, a control area, a configuration area, an edition area, a rendering area, backend service, and a database. The nodejs server provides front end operating environment, the browser is equivalent to a user terminal, the control area, the edition area, the configuration area and the rendering area are displayed in the browser, and the control area, the edition area and the configuration area provide user interaction functions.

[0069] Specifically, the control area provides such controls as time control, data fields and counted quantity, and user interaction is enabled in this area.

[0070] The configuration area is divided into two regions, of which the left region shows a list of controls selected by the user, and the right region shows the details of the controls selected in the left region. The details of the controls are different with the different controls themselves. For instance, the date control can provide time conditions, to be enquired according to different granularities as day, week, month, season, and year. For instance, the data field control can provide field conditions, the required fields are selected through a field list at the back end, and some filtering and sorting conditions are added. User interaction is enabled in this area.

[0071] The edition area provides editing environment for texts and controls.
Texts and control patterns can be amended in this area. This area allows interaction.

[0072] After the foregoing control area, configuration area and edition area have been well prepared, an update button is clicked in the rendering area to process the original texts of the edition area with results returned from the backend service requested in the control area and the configuration area, and to provide real-time rendering according to preset rendering scenarios.

Date Recue/Date Received 2022-02-28

[0073] The server mainly provides distal operating environment support of programs. The back end mainly provides data interface services, and provides corresponding data according to front end parameters; this application mainly provides two access interfaces, which are, respectively, (1) a data field (index) list interface; and (2) a dependent data field data query interface. The database mainly provides support for storage, reading and amendment of data.

[0074] Specific operating steps that realize the aforementioned web editor are as follows.

[0075] Step A¨ inserting a control configured with the backend data source in the original editor.

[0076] An editor model is firstly created, and it is placed in an editable state by setting the contenteditable attribute of the DOM element div as true through a browser DOM
API, then it is the prototype of the editor. A control carrying therewith a globally unique ID is inserted in the editor, and the insertion action of the control is realized through document.execCommand() method of the browser DOM API.

[0077] Preferred embodiments of Step A are as follows:

[0078] The user clicks the control of the configuration area, the clicked control is inserted in the edition area at this time, and the control carries therewith a globally unique ID (the icon is realized through a <img/> label, and deleting and moving as a whole are achieved);

[0079] The edition area achieves the editable effect through the contenteditable attribute of the DOM element div of the browser DOM API;

[0080] The insertion action of the icon is realized through document.execCommand() method of the browser DOM API.

[0081] Step B ¨ configuring a request parameter of the control.

Date Recue/Date Received 2022-02-28

[0082] Specifically, the request parameter of the data field information of the control is configured, and the data field information at least includes a data field list and a filtering condition option.

[0083] Preferred embodiments of Step B are as follows:

[0084] The user clicks the control of the edition area, and a windows form is popped up. The popup window is divided into two columns, of which the left column shows a list of controls existent in the edition area, and the right column shows the details of each control.

[0085] A certain control is selected from the list in the left column, and it is configured at the right column. The first checkbox in the right column is a selection box of data fields, in which is a data field list requested from the backstage according to user information. The second, the third and the fourth are respectively such filtering conditions as dimensions, dimension values, sortings and TOPNs.

[0086] Step C ¨ requesting information parameters of the control from the back end according to the request parameter, and storing all data results of the control, including parameters of the control.

[0087] Specifically, control information of the configured control is obtained; information parameters of the back end query interface are pieced together; a request is sent to the back end, and stored as a data result corresponding to the ID through E56 syntax Promise.all() method.

[0088] Preferred embodiments of Step C are as follows:

[0089] The update button is clicked, and information of all controls configured in Step B is obtained;

[0090] The request parameter (in which is included user information that has currently logged in) of the back end data query interface starts to be pieced together according to the configured control information, and a request is sent to the backend interface. Orderly Date Recue/Date Received 2022-02-28 storage of the returned result of the data is achieved through ES6 syntax Promise.all() method, namely being stored as a data result corresponding to the ID.

[0091] Step D ¨ performing a replacing operation on the control according to the data result in combination with the initial contents of the original editor.

[0092] Preferred embodiments of Step D are as follows:

[0093] The control is packaged and set through the img label carrying therewith the ID and a json string generated by configuration information, and it is searched whether the ID of the img matches with type through a DOM selector query SelectorAll(img');

[0094] After a control has been matched, the img label is replaced with the data result through createTextNode and replaceChild API of DOM.

[0095] All the aforementioned optional technical solutions are randomly combinable to form optional embodiments of the present invention, to which no repetition is made on a one-by-one basis.

[0096] To sum it up, in comparison with prior-art technology, the webpage editing method and device provided by the embodiments of the present invention achieve the following advantageous effects.

[0097] High efficiency: by adding an embeddable control to the conventional editor, and by enabling the control to configure the distal data source and then integrating with the conventional editor, the integrated function of filtering, editing and rendering is achieved;
the configuring, enquiring and rendering functions can be simultaneously realized through one windows form, so the cost of switching windows forms is reduced, in particular in this age of big data, real-time data contents updating function is provided with respect to colossal quantities of data, and content publishing efficiency is greatly enhanced.

Date Recue/Date Received 2022-02-28

[0098] Dynamic property: dynamic rendering and automatic updating of webpage editing are achieved by integrating such controls as time, index and dimension, the configuration area supports such plural condition queries as time, index, dimension, sorting and filtering, and the required data can be quickly generated according to these configurations.

[0099] Real-time property: after a date control has been configured, the latest data information can be viewed everyday without having to configure again.

[0100] Reusability: the improved webpage editing method makes it possible to store previously edited content formats as templates, to be integrated with such controls as internal dynamic date and other query conditions inside, whereby directly readable texts can be dynamically generated, and the production efficiency of the editing is greatly enhanced.

[0101] As understandable by persons ordinarily skilled in the art, realization of the entire or partial steps of the aforementioned embodiments can be completed by hardware, or by a program instructing relevant hardware, the program can be stored in a computer-readable storage medium, and the storage medium can be a read-only memory, a magnetic disk, or an optical disk, etc.

[0102] The embodiments of the present application are described with reference to flowcharts and/or block diagrams of the method, device (system), and computer program product embodied in the embodiments of the present application. As should be understood, each flow and/or block in the flowcharts and/or block diagrams, and any combination of flow and/or block in the flowcharts and/or block diagrams can be realized by computer program instructions. These computer program instructions can be supplied to a general computer, a dedicated computer, an embedded processor or a processor of any other programmable data processing device to form a machine, so that the instructions executed by the computer or the processor of any other programmable data processing device Date Recue/Date Received 2022-02-28 generate a device for realizing the functions designated in one or more flow(s) of the flowcharts and/or one or more block(s) of the block diagrams.

[0103] These computer program instructions can also be stored in a computer-readable memory enabling a computer or any other programmable data processing device to operate by a specific mode, so that the instructions stored in the computer-readable memory generate a product containing instructing means, and this instructing means realizes the functions designated in one or more flow(s) of the flowcharts and/or one or more block(s) of the block diagrams.

[0104] These computer program instructions can also be loaded onto a computer or any other programmable data processing device, so as to execute a series of operations and steps on the computer or the any other programmable device to generate computer-realized processing, so that the instructions executed on the computer or the any other programmable device provide steps for realizing the functions designated in one or more flow(s) of the flowcharts and/or one or more block(s) of the block diagrams.

[0105] Although preferred embodiments in the embodiments of the present application have been described so far, it is still possible for persons skilled in the art to make additional modifications and amendments to these embodiments upon learning of the basic inventive conception. Accordingly, the attached Claims are meant to cover the preferred embodiments and all modifications and amendments that fall within the scope of the embodiments of the present application.

[0106] Apparently, persons skilled in the art can make various amendments and modifications to the present invention without departing from the spirit and scope of the present invention.
Thus, if such amendments and modifications to the present invention fall within the Claims of the present invention and equivalent technology, the present invention is also meant to cover these amendments and modifications.

Date Recue/Date Received 2022-02-28

[0107] What is described above is merely directed to preferred embodiments of the present invention, and they are not meant to restrict the present invention. Any amendment, equivalent replacement and improvement makeable within the spirit and scope of the present invention shall all be covered within the protection scope of the present invention.

[0108] Contents not detailed in the present description pertain to prior-art technologies publicly known to persons skilled in the art.

Date Recue/Date Received 2022-02-28

Claims

1. A webpage editing system comprising:
a request receiving module, for receiving a data obtaining request and a rendering request input by a user through a webpage control, wherein the webpage control is used to characterize data attributes of a data source and wherein the data obtaining request comprises at least one characterization of the data attributes;
a data obtaining module, for sending the data obtaining request to a server, and obtaining a data source returned by the server according to the data obtaining request comprising:
matching a target query interface from a preset query interface list according to a data identification information of the data obtaining request and a corresponding relation between pre-stored data identifications and query interfaces; and sending to the target query interface to obtain the data source; and a rendering operating module, for performing a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.

2. The system of claim 1 wherein the receiving the data obtaining request further comprises receiving a request to select a webpage control and a condition input to the webpage control selected from the user.

3. The system of any one of claims 1 to 2 wherein the webpage control further comprises one or more of a time control, a data field control, and a counted quantity control.

4. The system of any one of claims 1 to 3 wherein the webpage control further comprises a data interface for transferring the corresponding data source.

5. The system of any one of claims 1 to 4 wherein at least one filtering condition is present when the webpage control is configured.

6. The system of claim 5 wherein the at least one filtering condition comprises one or more of a field list option, a filtering condition option, a sorting rule option and a configuration condition.

7. The system of any one of claims 1 to 6 wherein the data identification information is a webpage control type identified by the user in the data obtaining request.

8. The system of any one of claims 1 to 7 further comprising setting the server to a server type according to at least one requirement of the web page control.

9. The system of claim 8 wherein the server type is selected is one of a front end and a back end.

10. The system of any one of claims 1 to 9 wherein the preforming a rendering operation on the data source is according to a preset rendering scenario of the rendering mode wherein the rendering mode includes at least on preset rendering scenario.

11. The system of claim 10 wherein the preforming a rendering operation on the data source further includes selecting a rendering scenario by the user while the rendering operation is being performed wherein the rendering mode includes a plurality of preset rendering scenarios.

12. The system of any one of claims 10 to 11 wherein the rendering operation includes performing control pattern amendment to the webpage control.

13. The system of any one of claims 10 to 12 wherein the rendering operation includes performing data text amendment to the webpage control.

14. The system of any one of claims 1 to 13 wherein the receiving the rendering request occurs simultaneously to receiving a data obtaining request.

15. The system of any one of claims 1 to 14 wherein the system is a visual web front end editor.

16. The system of claim 15 further comprising:
a node's server for providing a front end operating environment;
a browser for providing a user terminal;
a backend service for providing data interface services; and a database for providing support for storage, reading and amendment of data.

17. The system of claim 16 wherein the browser further comprises a control area, an edition area, a configuration area and a rendering area and wherein control area, edition area, configuration area and rendering area are displayed in the browser.

18. The system of claim 17 wherein the control area, edition area, and configuration area provide user interaction functions.

19. The system of claim 18 wherein the control area provides one or more of a time control, data fields and counted quantity.

20. The system of any one of claims 18 to 19 wherein the configuration area further comprises a first region displaying at least one control selected by the user and a second region for displaying details of the at least on control selected.

21. The system of any one of claims 18 to 20 wherein the edition area provides an editing environment for one or more of at least one text and at least one control.

22. A user terminal configured to display a browser the terminal configured to:
receive a data obtaining request and a rendering request input by a user through a webpage control, wherein the webpage control is used to characterize data attributes of a data source and wherein the data obtaining request comprises at least one characterization of the data attributes;
send the data obtaining request to a server, and obtain a data source returned by the server according to the data obtaining request the sending and obtaining comprising:
matching a target query interface from a preset query interface list according to a data identification information of the data obtaining request and a corresponding relation between pre-stored data identifications and query interfaces; and sending to the target query interface to obtain the data source; and perform a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.

23. The user terminal of claim 22 wherein the receiving the data obtaining request further comprises receiving a request to select a webpage control and a condition input to the webpage control selected from the user.

24. The user terminal of any one of claims 22 to 23 wherein the webpage control further comprises one or more of a time control, a data field control, and a counted quantity control.

25. The user terminal of any one of claims 22 to 24 wherein the webpage control further comprises a data interface for transferring the corresponding data source.

26. The user terminal of any one of claims 22 to 25 wherein at least one filtering condition is present when the webpage control is configured.

27. The user terminal of claim 26 wherein the at least one filtering condition comprises one or more of a field list option, a filtering condition option, a sorting rule option and a configuration condition.

28. The user terminal of any one of claims 22 to 27 wherein the data identification information is a webpage control type identified by the user in the data obtaining request.

29. The user terminal of any one of claims 22 to 28 further comprising setting the server to a server type according to at least one requirement of the web page control.

30. The user terminal of claim 29 wherein the server type is selected is one of a front end and a back end.

31. The user terminal of any one of claims 22 to 30 wherein the preforming a rendering operation on the data source is according to a preset rendering scenario of the rendering mode wherein the rendering mode includes at least on preset rendering scenario.

32. The user terminal of claim 31 wherein the preforming a rendering operation on the data source further includes selecting a rendering scenario by the user while the rendering operation is being performed wherein the rendering mode includes a plurality of preset rendering scenarios.

33. The user terminal of any one of claims 31 to 32 wherein the rendering operation includes performing control pattern amendment to the webpage control.

34. The user terminal of any one of claims 31 to 33 wherein the rendering operation includes performing data text amendment to the webpage control.

35. The user terminal of any one of claims 22 to 34 wherein the receiving the rendering request occurs simultaneously to receiving a data obtaining request.

36. The user terminal of any one of claims 22 to 35 wherein the browser comprises a visual web front end editor.

37. The user terminal of any one of claims 22 to 36 wherein the browser comprises:
a control area, an edition area, a configuration area and a rendering area and wherein control area, edition area, configuration area and rendering area are displayed in the browser.

38. The user terminal of claim 37 wherein the control area, edition area, and configuration area provide user interaction functions.

39. The user terminal of any one of claims 37 to 39 wherein the control area provides one or more of a time control, data fields and counted quantity.

40. The user terminal of any one of claims 37 to 39 wherein the configuration area further comprises a first region displaying at least one control selected by the user and a second region for displaying details of the at least on control selected.

41. The user terminal of any one of claims 37 to 40 wherein the edition area provides an editing environment for one or more of at least one text and at least one control.

42. A webpage editing method comprising:
receiving a data obtaining request input by a user through a webpage control, wherein the webpage control is used to characterize data attributes of a data source;
sending the data obtaining request to a server wherein the data obtaining request comprises at least one characterization of the data attributes, and obtaining a data source returned by the server according to the data obtaining request comprising:
matching a target query interface from a preset query interface list according to a data identification information of the data obtaining request and a corresponding relation between pre-stored data identifications and query interfaces; and sending to the target query interface to obtain the data source;
receiving a rendering request; and performing a rendering operation on the data source according to a rendering mode to which the rendering request corresponds.

43. The method of claim 42 wherein the receiving a data obtaining request further comprises receiving a request to select a webpage control and a condition input to the webpage control selected from the user.

44. The method of any one of claims 42 to 43 wherein the webpage control further comprises one or more of a time control, a data field control, and a counted quantity control.

45. The method of any one of claims 42 to 44 wherein the webpage control further comprises a data interface for transferring the corresponding data source.

46. The method of any one of claims 42 to 45 wherein at least one filtering condition are present when the webpage control is configured.

47. The method of claim 46 wherein the at least one filtering condition comprises one or more of a field list option, a filtering condition option, a sorting rule option and a configuration condition.

48. The method of claim 42 wherein the data identification information is a webpage control type identified by the user in the data obtaining request.

49. The method of any one of claims 42 to 48 further comprising setting the server to a server type according to at least one requirement of the web page control.

50. The method of claim 49 wherein the server type is selected is one of a front end and a back end.

51. The method of any one of claims 42 to 50 wherein the preforming a rendering operation on the data source is according to a preset rendering scenario of the rendering mode wherein the rendering mode includes at least on preset rendering scenario.

52. The method of claim 51 wherein the preforming a rendering operation on the data source further includes selecting a rendering scenario by the user while the rendering operation is being performed wherein the rendering mode includes a plurality of preset rendering scenarios.

53. The method of any one of claims 51 to 52 wherein the rendering operation includes performing control pattern amendment to the webpage control.

54. The method of any one of claims 51 to 53 wherein the rendering operation includes performing data text amendment to the webpage control.

55. The method of any one of claims 42 to 54 wherein the receiving the rendering request occurs simultaneously to receiving a data obtaining request.