Qwrap Introduction: Apps fruits: pure core + DOM

Source: Internet
Author: User
Like a tree with many fruits, qwrap also has many apps. This article describes the "pure core + DOM" application, that is, apps/core_dom_pure.js.
The corresponding help documentation is here: http://dev.qwrap.com/resource/js/_docs/_jsdoc_temp/ (document generation tool Remember2015 Thank you very much !).
This application targets the following users: Component developers .
Component developers sometimes face a dilemma:
A: Depends on a database. The development process is simple, but the use is limited. You need to reference the dependent library on the page where the user is located.
B: No dependency development. The components developed in this way are not dependent, but the development cost is relatively high, and you need to handle compatibility issues by yourself. If a user already has a library, it will cause public Code Traffic waste.
If you have used yui2 or TANGRAM, you may know that there is a third option:
C: Dependent on a database during development, and no dependent components can be released during release.
Both yui2 and Tangram provide a series of static methods. during development, only static methods are used. During release, you can copy the required static methods to become a form without dependency.

Before retouch, qwrap is also a large static library that provides a series of static slave databases. Therefore, C can also be selected.
In addition, qwrap provides a dependency-free tool: You can reference apps/core_dom_pure.js to develop your own components. After development, copy your code to the "hard code" box on the following page and click "extract" to get a reduced qwrap.
Http://dev.qwrap.com/resource/js/_tools/combojsfiles/_examples/Solo.html
Automatic slimming will be retained for retouch code, so the code after automatic slimming can also be manually removed from unnecessary functions for secondary or multiple slimming.
The reduced code is copied to the front of the component code, and the component is no longer dependent.

By the way, when writing a component, I like to define the dependency between the component and the library, which is equivalent to the adaptation of a component to the library, you can also easily adapt your components to the dependent version of the library used by the dependent project, using the code already provided by the JS library.
For example, in the ComboBox component, the adaptation code is as follows:

View code

   VaR  Mix  = QW. objecth. Mix,
Domu = QW. domu,
Createelement = Domu. createelement,
Eventh = QW. eventh,
Target = Eventh. gettarget,
Keycode = Eventh. getkeycode,
Preventdefault = Eventh. preventdefault,
Custevent = QW. custevent,
Nodeh = QW. nodeh,
Addclass = Nodeh. addclass,
Removeclass = Nodeh. removeclass,
Setstyle = Nodeh. setstyle,
Getxy = Nodeh. getxy,
Ancestornode = Nodeh. ancestornode,
On = QW. eventtargeth. addeventlistener,
...

For details, refer to the dependency-free ComboBox component (AutoComplete component ).ArticleThe solo tool is not available yet, so there is a slight difference and we will not detail it in detail.

Appendix: qwrap blog: http://www.qwrap.com

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.